react-native-share: Android: can't share video to Instagram Story

Precondition

I found a way to provide images and videos to Instagram stories builder using base64 encoding (for Android only because for iOS it works fine just with file path or URL). Image publishing works well but it is impossible to publish a video using this method.

Android code example:

import RNFS from "react-native-fs"
import Share, { ShareSingleOptions } from "react-native-share"

const shareRemoteVideoToIGStories = (file: { source: string, name: string, type: string }) =>
  new Promise((resolve) => {
    const localFile = `${RNFS.DocumentDirectoryPath}/${file.name}`
    const options = {
      fromUrl: file.source,
      toFile: localFile,
    }
    RNFS.downloadFile(options).promise.then(() => {
      RNFS.readFile(localFile, "base64").then((base64) => {
        const cleanAndResolve = () => {
          RNFS.unlink(localFile).then(resolve)
        }
        const shareOptions: ShareSingleOptions = {
          social: Share.Social.INSTAGRAM_STORIES,
          backgroundVideo: `data:${file.type};base64,` + base64,
        }
        Share.shareSingle(shareOptions).then(cleanAndResolve).catch(cleanAndResolve)
      }).catch(resolve)
    }).catch(resolve)
  })

Steps to reproduce

  1. Provide base64 encoded video to Instagram Story using react-native-share
  2. Try to publish the story with provided video

Expected behaviour

Video is published properly

Actual behaviour

Video fails to be uploaded

Screenshot_20220706-132610__01

Also, the error shows up when trying to upload the story with provided video from the stories builder

Environment

  • React Native version: 0.67.3
  • Platform: any Android

react-native-share

Version: 7.6.4

Summary

I’m not sure I’m doing it the right way though. Please let me know if there is a better way to share videos to Instagram Stories from an Android device.

Edit

Fixed typo

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Comments: 21 (1 by maintainers)

Most upvoted comments

I’ve created a PR for backgroundVideo on Android. You can check the fix and usage here.

I haven’t tried but try changing

const shareOptions: ShareSingleOptions = {
  social: Share.Social.INSTAGRAM_STORIES,
  backgroundImage: `data:${file.type};base64,` + base64,
}

by

const shareOptions: ShareSingleOptions = {
  social: Share.Social.INSTAGRAM_STORIES,
  backgroundVideo: `data:${file.type};base64,` + base64,
}