base64 file url no response (error)

[ratihshav]

Steps to reproduce

1. When the url value is string, I can share it to any social media, but when the url value is base64 file, I can't share it.
2. I did try and catch to log the error, it turns out to be success.

Expected behaviour

Should send an image to any social media.

Actual behaviour

When I add a base64 file (image) to url, it should share an image to any social media, but there's no response at all and the image saved to the gallery instead of shared to any social media.

Environment

• React Native version: 0.57.2
• React Native platform + platform version: Android 8.0, Android 7.0, Android 5.0, etc

react-native-share

Version: 1.2.1

[jgcmarins]

it happens on both android and ios?
can you try to run your implementation against example and see if it has the same error?

[ratihshav]

it happens on both android and ios?
can you try to run your implementation against example and see if it has the same error?

Yes it happens on both android and ios, my code is same with the example, in my case it only can be shared if the url value is string, even I tried the base64 format image from docs, like REACT_ICON but still the same

[jgcmarins]

We have a troubleshooting section for base64 problems. Is it helpful?

[Rezaramdhanisti]

i have same problem too, it happen event i try the example using REACT_ICON but still cant share the react icon.

[jgcmarins]

is there any error message?

[MateusAndrade]

I faced a similar problem on IOS when is was trying to share a Screenshot on IOS. Unfortunately to get around this, i decided to share the file path which worked on most of the cases

[xliank]

I couldn't verify the problem without code,but can you provide sample for base64 ?
The base64 should provide data type as docs, it's should be variable string contain following format:

"data:<data_type>/<file_extension>;base64,<base64_data>"

you can try base64 from https://www.iconfinder.com/icons/1174949/js_logo_react_react_js_icon
put the string into a variable inside js file and export it. https://github.com/react-native-community/react-native-share/blob/master/example/images/imagesBase64.js

[ratihshav]

This is my code

async shareNow(type) {
    const { profile } = this.props

    const businessRequirments = await firebase
      .firestore()
      .collection("business")
      .doc("share_referral")
      .get()
    const shareReferralData = businessRequirments.data()
    const referralImage = shareReferralData.image
    let message = shareReferralData.caption.replace(
      "#referalCode",
      profile.user.referral_code
    )
    message = message.replace(/#n/g, "\n\n")

    let shareOptions = {
      title: "Share",
      message: message,
      url: referralImage,
      type: 'image/jpeg',
      subject: "Share",
    }

    if (Platform.OS === "android") {
      if (Platform.Version >= 23) {
        const allowedStorage = await PermissionsAndroid.request(
          PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE
        )

        if (allowedStorage !== "granted") {
          return
        }
      }
    }

    Alert.alert(
      i18n.t("common:attention"),
      i18n.t("page:shareReferalCode.shareNote"),
      [
        {
          text: "OK",
          onPress: () => {
            setTimeout(() => {
              Clipboard.setString(message)

              if (Platform.OS === "android") {
                Share.shareSingle(
                  Object.assign(shareOptions, {
                    social: type,
                  })
                )
              } else {
                Share.open(shareOptions)
              }
            }, 300)
          },
        },
      ],
      { cancelable: false }
    )
  }

the referralImage above is base64 data which I stored in firebase in https://pastebin.com/M5T4nHv4

[xliank]

Here is a thing, docs said :

NOTE: If both message and url are provided, url will be concatenated to the end of message to form the body of the message. If only one is provided it will be used

Remove the message line from shareOptions, so it will send as pure base64 instead of pure string.

Semoga membantu ✌️

[ratihshav]

I tried to remove message line from shareOptions but still nothing works. Do you have other ideas?

[xliank]

You can try remove Share.Single because it is only allow to share to certain app (single)
Using Share.Open with title and url only to see if it works.
Make sure you have set provider. See Troubleshooting section https://github.com/react-native-community/react-native-share/blob/master/README.md#troubleshooting

[ratihshav]

Thank you! I followed the troubleshooting section, it works on Android, but on iOS still can't share anything but only to Twitter and Facebook.

[MateusAndrade]

Thank you! I followed the troubleshooting section, it works on Android, but on iOS still can't share anything but only to Twitter and Facebook.

What happens when you try to Share to another application on IOS?