React-native-image-picker: latest version breaking on android with react-native 0.41.2

Created on 24 Feb 2017  路  37Comments  路  Source: react-native-image-picker/react-native-image-picker

I followed example and used following code, but it is just crashing app as soon as I am clicking on use camera options on the other hand it is working perfectly when I am using select image from library.

ImagePicker.showImagePicker(options, (response) => {
console.log('Response = ', response);

if (response.didCancel) {
console.log('User cancelled image picker');
}
else if (response.error) {
console.log('ImagePicker Error: ', response.error);
}
else if (response.customButton) {
console.log('User tapped custom button: ', response.customButton);
}
else {
let source = { uri: response.uri };
this.setState({
avatarSource: source
});
}
});

"dependencies": {
"react": "15.4.2",
"react-native": "0.41.2",
"react-native-image-picker": "^0.25.5"
},

Bug

Most helpful comment

@manjeets12 and @dsvictor94

Could you check android/build.gradle?

buildscript {
    repositories {
        jcenter()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:2.2.+' // <============= is it lower 2.2?
    }
}

if it's lower, you will need to update it to 2.2.+

Then you should update android/gradle/wrapper/gradle-wrapper.properties to

#Thu Jun 09 11:55:07 EDT 2016
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-2.14.1-all.zip ### <====== TO THIS

And try again.

Waiting for your report )

All 37 comments

@manjeets12 Could you give more information about crash? I mean logs from Android.

Did you add the next lines to the android/app/src/main/AndroidManifest.xml

<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

Yes I have added those lines,
here is my code and errors image

const imageOptions = {
quality: 1,
maxWidth: 500,
maxHeight: 500,
storageOptions: {
skipBackup: true
}
};

ImagePicker.launchCamera(imageOptions, (response) => {
// Same code as in above section!
let source = { uri: response.uri };
this.setState({
avatarSource: source
});
});

image

* forget to mention
I am testing on my micromax mobile (android 5.1)

@manjeets12 What version of Android did you use for testing? Was it device or emulator? If it was emulator, will you write emulator params for repeating bug?

I am testing on my micromax mobile (android 5.1)

Thanks.

@manjeets12 Do you use proguard in your Android project?

no I didn't , even I don't have a idea about that,

yes I just seen there is an autogenerated progaurd file

Add project specific ProGuard rules here.

By default, the flags in this file are appended to flags specified

in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt

You can edit the include path and order by changing the proguardFiles

directive in build.gradle.

#

For more details, see

http://developer.android.com/guide/developing/tools/proguard.html

Add any project specific keep options here:

If your project uses WebView with JS, uncomment the following

and specify the fully qualified class name to the JavaScript interface

class:

-keepclassmembers class fqcn.of.javascript.interface.for.webview {

public *;

}

Disabling obfuscation is useful if you collect stack traces from production crashes

(unless you are using a system that supports de-obfuscate the stack traces).

-dontobfuscate

React Native

Keep our interfaces so they can be used by other ProGuard rules.

See http://sourceforge.net/p/proguard/bugs/466/

-keep,allowobfuscation @interface com.facebook.proguard.annotations.DoNotStrip
-keep,allowobfuscation @interface com.facebook.proguard.annotations.KeepGettersAndSetters
-keep,allowobfuscation @interface com.facebook.common.internal.DoNotStrip

Do not strip any method/class that is annotated with @DoNotStrip

-keep @com.facebook.proguard.annotations.DoNotStrip class *
-keep @com.facebook.common.internal.DoNotStrip class *
-keepclassmembers class * {
@com.facebook.proguard.annotations.DoNotStrip *;
@com.facebook.common.internal.DoNotStrip *;
}

-keepclassmembers @com.facebook.proguard.annotations.KeepGettersAndSetters class * {
void set();
get();
}

-keep class * extends com.facebook.react.bridge.JavaScriptModule { *; }
-keep class * extends com.facebook.react.bridge.NativeModule { *; }
-keepclassmembers,includedescriptorclasses class * { native ; }
-keepclassmembers class * { @com.facebook.react.uimanager.UIProp ; }
-keepclassmembers class * { @com.facebook.react.uimanager.annotations.ReactProp ; }
-keepclassmembers class * { @com.facebook.react.uimanager.annotations.ReactPropGroup ; }

-dontwarn com.facebook.react.**

okhttp

-keepattributes Signature
-keepattributes Annotation
-keep class okhttp3.* { *; }
-keep interface okhttp3.
* { ; }
-dontwarn okhttp3.
*

okio

-keep class sun.misc.Unsafe { ; }
-dontwarn java.nio.file.

-dontwarn org.codehaus.mojo.animal_sniffer.IgnoreJRERequirement
-dontwarn okio.**

@manjeets12 please look at android/app/build.gradle. What does enableProguardInReleaseBuilds key value have? True or False?

@rusfearuth actually it is false right as I am still working on development version, will set set to true for realease version

Same problem here, but with react-native version 0.40.0

I am testing with android 5.1 too.
I will came back as soon as test with another device.

OBS:
launchImageLibrary works without problems, the error appear when I call launchCamera

I notice that the provider authorities generated by gradle disagree with authority requested by code

The gradle replaced android:authorities="${applicationId}.provider" with android:authorities="com.imagepicker.provider" instead of the final applicationId.

Apparently this is a gradle bug, but for fast fix I replaced ${applicationId} with my aplication id in node_modules/react-native-image-picker/android/src/main/AndroidManifest.xml

My Gradle version is 2.14.1

@dsvictor94 I've found it too, but your solution is workaround only. Been looking for solution since Feb 25.

To avoid edit react-native-image-picker source I edit my manifest and added:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    [...]
      <provider tools:replace="android:authorities"
          android:name="android.support.v4.content.FileProvider"
          android:authorities="${applicationId}.provider"
          android:exported="false"
          android:grantUriPermissions="true">
          <meta-data
              android:name="android.support.FILE_PROVIDER_PATHS"
              android:resource="@xml/provider_paths" />
      </provider>
    </application>

</manifest>

play attention to the addition of namespace tools on line 2

this force gradle use your definition of provider instead of the definition of react-native-image-picker.

This is a more graceful workaround

@dsvictor94 馃憤 Going to make fix

Sorry, I installed the master branch to teste if the commit solve the problem I it just added this warning

Warning: /home/victor/victor/kissed/android/app/src/main/AndroidManifest.xml:13:9 Warning:
    provider#android.support.v4.content.FileProvider@android:authorities was tagged at AndroidManifest.xml:13 to replace other declarations but no other declaration present
/home/victor/victor/kissed/android/app/src/main/AndroidManifest.xml:13:9 Warning:
    provider#android.support.v4.content.FileProvider@android:authorities was tagged at AndroidManifest.xml:13 to replace other declarations but no other declaration present

and nothing solved, the merged manifest remains incorrect

        [...]
        <provider
            android:name="android.support.v4.content.FileProvider"
            android:authorities="com.imagepicker.provider"
            android:exported="false"
            android:grantUriPermissions="true" >
            <meta-data
                android:name="android.support.FILE_PROVIDER_PATHS"
                android:resource="@xml/provider_paths" />
        </provider>
    </application>

I think I was misunderstood in my last comment (probably because of my poor English), the workaround must be applied to the main manifest (the same you add permissions), not in the library manifest.

I thing there are nothing you can do based on my workaround except add a note in installation instruction

@rusfearuth ^ seems like we should roll back this commit

@marcshilling Yeah... I think too and look better solution.

@dsvictor94 Have you changed android section in your app gradle build file?

bug still on lastest version 0.25.7 (my device : android 4.4.2).
Crash on Camera option.
Debug log :
"02-27 18:18:19.858 29125-29172/com.package W/ContextImpl: Failed to ensure directory: /storage/extSdCard/Android/data/com.package/files/Pictures"

@hoavo It seems that catalog wasn't created

I think nobody have change the build.gradle file, but if it helps

build.gradle.txt

@dsvictor94 I've changed )

@dsvictor94 Okey, I'm going to create test project with using settings like yours.

@manjeets12 and @dsvictor94

Could you check android/build.gradle?

buildscript {
    repositories {
        jcenter()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:2.2.+' // <============= is it lower 2.2?
    }
}

if it's lower, you will need to update it to 2.2.+

Then you should update android/gradle/wrapper/gradle-wrapper.properties to

#Thu Jun 09 11:55:07 EDT 2016
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-2.14.1-all.zip ### <====== TO THIS

And try again.

Waiting for your report )

@hoavo Did crash happen after you confirm of taken photo?

I am without a device now, but I build and inspect de manifest and apparently solves the problem.
Sorry when I said the my gradle version is 2.14.1, I saw the gradle version to the wrong project. It was 2.4.

@dsvictor94 If I understand right, it's fine. Yes?

I can't make sure because I am without a device, but yes, it's fine now.

I tested today and upgrading the gradle (and the gradle plugin) solves the provider authorities problem. @rusfearuth, thanks a lot by your fast support

@rusfearuth Crash after capture a photo.
Thanks for your support

@hoavo I found why crash happens. Your case described in #478.

@dsvictor94 @manjeets12 I think we can close this issue. Do you?

@rusfearuth I will confirm it soon,

My device(SO-01F - 4.4.2) crashed by FileProvider issue.
Both build.gradle and gradle-wrapper.properties are following above codes.
But I found react-native-image-crop-picker working on using camera.
So I changed the line in ImagePickerModule like react-native-image-crop-picker.
Now it seems to me working, but I don't know why it works.

// In compatUriFromFile
// ...
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP)
    {
      result = Uri.fromFile(file);
    }
// ...

@tanaka0x Could you check a new version?

@rusfearuth I tried 0.26.1 with RN 0.42, it can take a photo using camera.
I think this issue was fixed in my case.
However sometimes another problem occured I think it is related to #471

Was this page helpful?
0 / 5 - 0 ratings