CODEWITHSUNDEEP
iosreact-nativern-fetch-blob
Deepali Jadhav
Deepali Jadhav

Reputation: 600

Download image not working on IOS device - React Native

I implemented functionality for download image in React Native using RNFetchBlob Its Working fine with android but on IOS device it's not working.

Following is my react native code for download functionality.

downloadImg = (url) => {
      var that = this;
      async function requestCameraPermission() {
        const granted = await PermissionsAndroid.request(
          PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
          {
            title: 'Test App',
            message: 'Test App needs access to your gallery ',
          }
        );
        if (granted === PermissionsAndroid.RESULTS.GRANTED) {
          that.actualDownload(url);
        } else {
          Alert.alert('Permission Denied!', 'You need to give storage permission to download the file');
        }
      }
      if (Platform.OS === 'android') { 
        requestCameraPermission();
      } else {
        this.actualDownload(url);
      }
}


actualDownload = (url) => {
          var date = new Date();
          var image_URL = url;
          var ext = this.getExtention(image_URL);
          ext = "." + ext[0];
          const { config, fs } = RNFetchBlob;
          let PictureDir = Platform.OS === 'ios' ? fs.dirs.DocumentDir : fs.dirs.PictureDir;
          let options = {
          fileCache: true,
          addAndroidDownloads: {
              useDownloadManager: true,
              notification: true,  
              path: PictureDir + "/Images/image_" + Math.floor(date.getTime()
              + date.getSeconds() / 2) + ext,
              description: 'Image'
          }
          }
          config(options).fetch('GET', image_URL).then((res) => {
              console.log("Thank you","Image Downloaded Successfully."); 
          });
    }

Upvotes: 1

Views: 3222

Answers (2)

Rahul Pandita
Rahul Pandita

Reputation: 11

That method works for ios as well. The notification doesn't come. If you want to check that it is downloaded or not, you can check it by logging the path in terminal(Mac) or cmd(Windows) and access it through the terminal itself. It might not be visible in finder(Mac) or file explorer(Windows).

You can follow the path that you log from the function in this way: cd ~/Library/Developer/CoreSimulator/Devices...

Upvotes: 0

Lenoarod
Lenoarod

Reputation: 3610

the addAndroidDownloads only works for android. when you use the addAndroidDownloads the path in config is not useless. but for ios, the path has to be added. try the following code, and you can add progress for ios.

actualDownload = (url) => {
          var date = new Date();
          var image_URL = url;
          var ext = this.getExtention(image_URL);
          ext = "." + ext[0];
          const { config, fs } = RNFetchBlob;
          let PictureDir = Platform.OS === 'ios' ? fs.dirs.DocumentDir : fs.dirs.PictureDir;
          let options = {
          fileCache: true,
          path: PictureDir + "/Images/image_" + Math.floor(date.getTime() // add it
          addAndroidDownloads: {
              useDownloadManager: true,
              notification: true,  
              path: PictureDir + "/Images/image_" + Math.floor(date.getTime()
              + date.getSeconds() / 2) + ext,
              description: 'Image'
          }
          }
          config(options).fetch('GET', image_URL).then((res) => {
              console.log("Thank you","Image Downloaded Successfully."); 
          });
    }

here are the document says:

When using DownloadManager, fileCache and path properties in config will not take effect, because Android DownloadManager can only store files to external storage, also notice that Download Manager can only support GET method, which means the request body will be ignored.

Upvotes: 1

Related Questions