RN从IOS中的URL获取blob下载docx或pdf

Posted 2023-03-15

【中文标题】RN从IOS中的URL获取blob下载docx或pdf

【英文标题】：RN fetch blob download docx or pdf from URL in IOS

【发布时间】：2020-02-04 06:51:20

【问题描述】：

做了什么：

在 android 中实现，并在 Android 中的特定 DCIM directory 中下载。 在 ios 中使用DocumentDir 下载 pdf 或 docx 文件。使用"rn-fetch-blob": "^0.12.0";

错误：

在 IOS 中，它在控制台中显示消息：

文件保存到 /var/mobile/Containers/Data/Application/E6FDC2DD-7FCA-44DC-85C4-A275078F8825/Documents/wow13.pdf

要下载的代码是这样的：

downloadFileOnSuccess = async () => 
    let dirs =
      Platform.OS == 'ios'
        ? RNFetchBlob.fs.dirs.DocumentDir
        : RNFetchBlob.fs.dirs.DCIMDir;
    console.log(dirs, 'document path');
    RNFetchBlob.config(
      // response data will be saved to this path if it has access right.

      fileCache: true,
      path: dirs + `/wow13.pdf`,
    )
      .fetch(
        'GET',
        'https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf',
        
          //some headers ..
        ,
      )
      .then(res => 
        // the path should be dirs.DocumentDir + 'path-to-file.anything'
        console.log('The file saved to ', res.path());
      );
  ;

但我无法在我的 iphone 7 真实设备中找到文件的下载位置。我在IOS中缺少任何权限吗？ Havent为IOS添加了任何权限。

【问题讨论】：

嘿，使用 LibraryDirectoryPath，而不是 DocumentDir 路径。

即使有库路径我也看不到任何这样的文件

是的，但首先您需要创建自定义文件夹。变量 PATH_TO_CREATE = $RNFS.LibraryDirectoryPath/Your_Folder_Name; RNFetchBlob.fs.mkdir(PATH_TO_CREATE) .then(() => ... ) .catch((err) => ... );

在 RNFS 中有很多选项可以将您的文件保存在 ios 和 android...bcoz 我已经完成了 rnfs ..

不。 RNFS.mkdir(PATH_TO_CREATE).then((result)=> console.log('Folder Created'); ).catch((err) => console.log('err', err) );

【参考方案1】：

感谢pruthvi，我得到了答案，对于ios我需要提示用户：

.then(resp => 
      if (Platform.OS === "ios") 
        RNFetchBlob.ios.openDocument(resp.data);
      
    )

希望对大家有帮助

【参考方案2】：

最新的工作解决方案：

const actualDownload = () => 
        const  dirs  = RNFetchBlob.fs;
        const dirToSave = Platform.OS == 'ios' ? dirs.DocumentDir : dirs.DownloadDir
        const configfb = 
            fileCache: true,
            useDownloadManager: true,
            notification: true,
            mediaScannable: true,
            title: pdfInfo.pdf,
            path: `$dirToSave/$pdfInfo.pdf`,
        
        const configOptions = Platform.select(
            ios: 
                fileCache: configfb.fileCache,
                title: configfb.title,
                path: configfb.path,
                appendExt: 'pdf',
            ,
            android: configfb,
        );
    
        console.log('The file saved to 23233', configfb, dirs);
    
        RNFetchBlob.config(configOptions)
            .fetch('GET', `https://aquatherm.s3.ap-south-1.amazonaws.com/pdfs/$pdfInfo.pdf`, )
            .then((res) => 
                if (Platform.OS === "ios") 
                    RNFetchBlob.fs.writeFile(configfb.path, res.data, 'base64');
                    RNFetchBlob.ios.previewDocument(configfb.path);
                
                setisdownloaded(false)
                if (Platform.OS == 'android') 
                    showSnackbar('File downloaded');
                
                console.log('The file saved to ', res);
            )
            .catch((e) => 
                setisdownloaded(true)
                showSnackbar(e.message);
                console.log('The file saved to ERROR', e.message)
            );
    

【讨论】：

非常适合我，只需提供直接网址：谢谢。

【参考方案3】：

即兴创作 Ajmall Hasan 的回答。 我必须将 $pdfInfo.pdf 更改为 $'pdfInfo.pdf' 才能使其工作

const actualDownload = () => 
        const  dirs  = RNFetchBlob.fs;
        const dirToSave = Platform.OS == 'ios' ? dirs.DocumentDir : dirs.DownloadDir
        const configfb = 
            fileCache: true,
            useDownloadManager: true,
            notification: true,
            mediaScannable: true,
            title: pdfInfo.pdf,
            path: `$dirToSave/$'pdfInfo.pdf'`,
        
        const configOptions = Platform.select(
            ios: 
                fileCache: configfb.fileCache,
                title: configfb.title,
                path: configfb.path,
                appendExt: 'pdf',
            ,
            android: configfb,
        );
    
        console.log('The file saved to ', configfb, dirs);
    
        RNFetchBlob.config(configOptions)
            .fetch('GET', `https://aquatherm.s3.ap-south-1.amazonaws.com/pdfs/$'pdfInfo.pdf'`, )
            .then((res) => 
                if (Platform.OS === "ios") 
                    RNFetchBlob.fs.writeFile(configfb.path, res.data, 'base64');
                    RNFetchBlob.ios.previewDocument(configfb.path);
                
                if (Platform.OS == 'android') 
                    showSnackbar('File downloaded');
                
                console.log('The file saved to ', res);
            )
            .catch((e) => 
                showSnackbar(e.message);
                console.log('The file saved to ERROR', e.message)
            );
    

【讨论】：

africau.edu/images/default/sample.pdf 替换此 URL 它对我有用

【参考方案4】：

 GetItem_downloadbtn = (item, itemname) => 
var pdfInfo = itemname;
const  dirs  = RNFetchBlob.fs;
const dirToSave = Platform.OS == 'ios' ? dirs.DocumentDir : dirs.DownloadDir
const configfb = 
    fileCache: true,
    useDownloadManager: true,
    notification: true,
    mediaScannable: true,
    title: pdfInfo.pdf,
    path: `$dirToSave/$itemname`,

const configOptions = Platform.select(
    ios: 
        fileCache: configfb.fileCache,
        title: configfb.title,
        path: configfb.path,
        appendExt: 'pdf',
    ,
    android: configfb,
);
console.log('The file saved to 23233', configfb, dirs);

RNFetchBlob.config(configOptions)
    .fetch('GET', item, )
    .then((res) => 
        if (Platform.OS === "ios") 
            RNFetchBlob.fs.writeFile(configfb.path, res.data, 'base64');
            RNFetchBlob.ios.previewDocument(configfb.path);
        
        setisdownloaded(false)
        if (Platform.OS == 'android') 
            showSnackbar('File downloaded');
        
        console.log('The file saved to ', res);
    )
    .catch((e) => 
        setisdownloaded(true)
        showSnackbar(e.message);
        console.log('The file saved to ERROR', e.message)
    );