react-native-share-extension: Invalid image path obtained from ShareExtension.data

When i navigate to the Host Application and pass the image url which i have obtained from value of ShareExtension then in my real device the imgPath wont work! I actually cannot use the url which looks like this:

/private/var/mobile/Containers/Data/PluginKitPlugin/09BD2F36-975D-4DB4-80FD-2446799A48AE/tmp/RNSE_TEMP_IMG.png

I have tried to check if the imgPath is available. I did this with react-native-fs and there i get for the imgPath the error that the file is not there.

Everything works great on Android (Simulator & RealDevice) as well as on the iOS Simulator. But it fails on iOS RealDevice.

Receiving ShareData:

try {
    const { type, value } = await ShareExtension.data();
    let error;
    const url = `shareExtensionApp://shareImage/${value}`;
    ShareExtension.openURL(url);
    ShareExtension.close();
} catch (e) {
    Alert.alert(null, e);
}

Use value for my Image component:

<Image source={{uri: value}}/>

About this issue

Original URL
State: open
Created 6 years ago
Comments: 28

Most upvoted comments

@BigPun86 With app groups in place, it’s actually way easier to achieve this than the way you’re doing it.

You only need app groups and react-native-fs to accomplish it:

const data = await ShareExtension.data()

if (Platform.OS === 'ios') {
    const appGroupPath = await RNFS.pathForGroup('group.com.myapp')

    await Promise.all(data.map(async (image) => {
        const filename = path.basename(image.value)
        const destination = `${appGroupPath}/${filename}`
        await RNFS.copyFile(image.value, destination)
    }))
}

For any future readers that might need help with this, just let me know.

isaachinman on May 1, 2018

@frenberg That’s a great point. I’ve run into URI encoding issues before, but always on Android, not iOS.

This URI is encoded twice:

/private/var/mobile/Library/Mobile%2520Documents/com~apple~CloudDocs/Documents/<fileName>

If I run:

decodeURIComponent(decodeURIComponent('/private/var/mobile/Library/Mobile%2520Documents/com~apple~CloudDocs/Documents/<fileName>'))

I get:

"/private/var/mobile/Library/Mobile Documents/com~apple~CloudDocs/Documents/<fileName>"

isaachinman on Nov 15, 2018

@frenberg @isaachinman now it works, thanks for your help!

radreamer on Nov 19, 2018

Both providers return a string and the type text/plain. The url part just makes sure the full url is returned.

oberlaender on Nov 13, 2018

@ahmedjamshed First, you should always format code when you write in a GitHub issue. Second, how could I possibly help without any error or any information whatsoever? If you post more information here in the proper way, I am happy to help you.

isaachinman on Jul 2, 2018