Error: Download interrupted

[FarrukhAnwar1]

RN Project Version: 0.72.1 ReactNativeBlobUtil Version: ^0.18.3

I've created a function for my React Native application that downloads a webm audio file given a URL (passed URL returns audio/webm) and filename (passed filename always ends in .webm). While it sometimes completely downloads the audio file correctly to the downloads folder, other times it stops halfway and throws Error: Download interrupted. I've checked the URLs that lead to these errors and they're still visible in the browser so I don't understand why this error is happening. Examples of URLs which lead to these errors include:

• https://rr5---sn-hp57ynss.googlevideo.com/videoplayback?expire=1688961952&ei=QC-rZKXBIoHuuwLJqorQBA&ip=2603%3A9001%3A6302%3A32c1%3A59e3%3A20c2%3A8e05%3Abb26&id=o-AP6Rq2SxqG9eAGGQzL7HqREpKfK2D77bN6mL52bn_bC0&itag=251&source=youtube&requiressl=yes&mh=cs&mm=31%2C26&mn=sn-hp57ynss%2Csn-q4flrnsl&ms=au%2Conr&mv=m&mvi=5&pl=36&initcwndbps=2041250&spc=Ul2Sq9etje0MBIUGO_TqC9Q8_JFK0TDnGC5lqGRTmg&vprv=1&svpuc=1&mime=audio%2Fwebm&ns=eCIricjNhpgxbnDQis8AXWgO&gir=yes&clen=2709916&dur=171.021&lmt=1669735064215628&mt=1688939831&fvip=1&keepalive=yes&fexp=24007246&beids=24350017&c=WEB&txp=5532434&n=EnAWhuYECKVW1-4F&sparams=expire%2Cei%2Cip%2Cid%2Citag%2Csource%2Crequiressl%2Cspc%2Cvprv%2Csvpuc%2Cmime%2Cns%2Cgir%2Cclen%2Cdur%2Clmt&lsparams=mh%2Cmm%2Cmn%2Cms%2Cmv%2Cmvi%2Cpl%2Cinitcwndbps&lsig=AG3C_xAwRAIgP2yV5pW02p5BgXFSC00n2Tg75Tc9QY2D4RuMMCq66NICIADi80jdr9Nxycg27R5OQfH7_5lp2vc8p2OVHWCmHsXk&sig=AOq0QJ8wRgIhAI3nwg0ZCgNnVUfTZPsmnRgHngaNrgjSWWbsWfaFjEVrAiEA_bUex3-7nyOuZt0oPdVHDP2YNMubzIOb5pGfQDPzQyM%3D
• https://rr3---sn-hp57yn7y.googlevideo.com/videoplayback?expire=1688961961&ei=SS-rZK6OM__JzN0P5aqO0Aw&ip=2603%3A9001%3A6302%3A32c1%3A59e3%3A20c2%3A8e05%3Abb26&id=o-AHoEHhghcnvH7FDeddQRsQUydPHlFPf12KwAdZZiA-aV&itag=249&source=youtube&requiressl=yes&mh=L_&mm=31%2C29&mn=sn-hp57yn7y%2Csn-hp57knds&ms=au%2Crdu&mv=m&mvi=3&pl=36&initcwndbps=2203750&spc=Ul2Sq1Eva7elMiq1DDrUgijXS8ouRejddg4pIymtng&vprv=1&svpuc=1&mime=audio%2Fwebm&ns=Pnqu4UYAeT-_qiwqp7qQlQoO&gir=yes&clen=1617125&dur=265.021&lmt=1685782147134072&mt=1688940064&fvip=1&keepalive=yes&fexp=24007246&beids=24350017&c=WEB&txp=4532434&n=quLGd3r4-Y34QtCO&sparams=expire%2Cei%2Cip%2Cid%2Citag%2Csource%2Crequiressl%2Cspc%2Cvprv%2Csvpuc%2Cmime%2Cns%2Cgir%2Cclen%2Cdur%2Clmt&lsparams=mh%2Cmm%2Cmn%2Cms%2Cmv%2Cmvi%2Cpl%2Cinitcwndbps&lsig=AG3C_xAwRQIhAPN-3ssbJstWWkYFwABmbCIL3EXAvnPS6WZmzp55eZOaAiBRtwHabfYmGuIaiX-TTdPh-ulaUTjDqumgrXbRA2OP_w%3D%3D&sig=AOq0QJ8wRAIgbV3EdIPmLzDvp6DrHKjKVLeqR1Vcu4IvpSRqKmHLYtkCICyylPu4f0gDL2idsnIPnB7LvHp8H-lijHOrfsHRymSi
• https://rr5---sn-hp57ynss.googlevideo.com/videoplayback?expire=1688961966&ei=TS-rZLL9OeipzN0P3oihqAY&ip=2603%3A9001%3A6302%3A32c1%3A59e3%3A20c2%3A8e05%3Abb26&id=o-AGrjqxFSHzVKLeJ6G6I_63ZU247FShQM35TwYk4b0eB8&itag=249&source=youtube&requiressl=yes&mh=uN&mm=31%2C26&mn=sn-hp57ynss%2Csn-q4fl6nsr&ms=au%2Conr&mv=m&mvi=5&pl=36&initcwndbps=2203750&spc=Ul2SqyOpnslAjeopzkNQUxoIjB_NBmrOeQl23aO96g&vprv=1&svpuc=1&mime=audio%2Fwebm&ns=2MRir9F5TZO6_qSffBt_cl0O&gir=yes&clen=1627648&dur=270.021&lmt=1665296376411965&mt=1688940064&fvip=4&keepalive=yes&fexp=24007246&beids=24350017&c=WEB&txp=5432434&n=SlhSQMV0QBA75Qoh&sparams=expire%2Cei%2Cip%2Cid%2Citag%2Csource%2Crequiressl%2Cspc%2Cvprv%2Csvpuc%2Cmime%2Cns%2Cgir%2Cclen%2Cdur%2Clmt&lsparams=mh%2Cmm%2Cmn%2Cms%2Cmv%2Cmvi%2Cpl%2Cinitcwndbps&lsig=AG3C_xAwRgIhALG1OQnojM2i0bUoQ7RgUqNARWAULo9NZrWBTyxPXvD2AiEAhe663FBS3QAdiy7R4iXWQydMfGIgpiq_skwVftXGHjI%3D&sig=AOq0QJ8wRgIhAIOFwlAeJIDrYUzLdLK_FkX_7PP_AucUR4K-N4TGcb1rAiEA_9gOgVEegxnHQ1uEaww4aMUtC583m0xwjjRSdxKoAFs%3D

I don't know if these links are still going to be live when this issue is seen as they have an expiration date. By the way, these links are generated by the react-native-ytdl library (https://www.npmjs.com/package/react-native-ytdl) version ^4.8.3.

Function Definition:

const downloadFile = async (url: string, fileName: string) => {
        try {
            const storagePermissionGranted = await requestStoragePermission();
            if (storagePermissionGranted) {
                const dirs = RNFetchBlob.fs.dirs;
                const fileDir = Platform.OS === "android" ? dirs.DownloadDir : dirs.DocumentDir;
                const filePath = `${fileDir}/${fileName}`;
                
                const options = {
                    path: filePath
                };

                const task = ReactNativeBlobUtil.config( options ).fetch("GET", url, { "Cache-Control": "no-store", "Accept": "audio/webm" }); 
                task.then(result => {
                    console.log("Main file downloaded to: ", result.path());
                }).catch((error) => {
                    console.error(`Error while downloading main file ${fileName} with primary address ${url} and path ${filePath}:`, error);
                });
            }
        } catch (error) {
            console.error("Error while requesting storage permission:", error);
        }
};

[RonRadtke]

Do you see this error while debugging yourself? Depending on the file size it could be that e.g. a change from wifi to mobile network happens and the download gets interrupted And does it happen on Android or ios?

[FarrukhAnwar1]

Yeah, I saw it while debugging myself. I'm pretty sure my phone was connected to WIFI the entire time. It happened on Android.

[marry1822]

I have a similar issue on IOS, I can't download files more than 10Mb, the download process stops halfway but there are no errors, just stops and that's it. Looks like an infinite download. I tried with WIFI and mobile network, no difference.

At the same time, files less that 10Mb are downloaded successfully.

Do you see this error while debugging yourself? Depending on the file size it could be that e.g. a change from wifi to mobile network happens and the download gets interrupted And does it happen on Android or ios?

My code:

const downloadFile = async (fileUrl, fileExt, fileName, fileId) => {
    const {
      exists,
      unlink,
      dirs: {DownloadDir, DocumentDir},
    } = ReactNativeBlobUtil.fs;
    const {config} = ReactNativeBlobUtil;
    const isIOS = Platform.OS == 'ios';
    const aPath = Platform.select({ios: DocumentDir, android: DownloadDir});
    const fPath = `${aPath}/${fileName}${fileExt}`;
    const configOptions = Platform.select({
      ios: {
        fileCache: true, 
        path: fPath,
        notification: true,
        overwrite: true,
      }})
    exists(fPath)
      .then(isExist => {
        if (isExist) {
          return unlink(fPath);
        } else return;
      })
      .then(() => resourceAPI.downloadFile(login, fileId))
      .then(res => {
        if (res.status === 200) {
          if (isIOS) {
            config(configOptions)
              .fetch('GET', fileUrl, {
                Authorization: `Basic ${base64.encode(
                  `${login.username}:${login.password}`,
                )}`,
              })
              .progress({count: 10}, (received, total) => {
                setProgress(received);
              })
              .then(res => {
                setTimeout(() => {
                  ReactNativeBlobUtil.ios.previewDocument(res.path());
                }, 300);
              })
              .catch(error => {
                console.log(error);
                Alert.alert(
                  `Error:\n ${error}`,
                );
              });