使用Expo+React Native显示本地PDF遇react-native-fetch-blob链接失败求助

兄弟，看你日志里的TypeError: path must be a string or Buffer加上react-native-fetch-blob自动链接失败，核心问题其实是react-native-fetch-blob和Expo环境不兼容——Expo的managed workflow不允许直接做原生链接操作，而这个库必须依赖原生配置，自然会栽跟头。给你几个靠谱的解决步骤：

• 替换react-native-fetch-blob为Expo官方文件系统库
  先卸载旧库，安装适配Expo的expo-file-system：

  npm uninstall react-native-fetch-blob
  expo install expo-file-system
  

  Expo的file-system完全能替代它的本地文件操作能力，而且不需要原生链接，完美适配Expo环境。

• 修改react-native-pdf的资源加载逻辑
  原来用react-native-fetch-blob加载assets里的PDF，现在换成expo-file-system+expo-asset来处理本地资源URI，避免权限和路径问题：

  import React, { useState, useEffect } from 'react';
  import { View } from 'react-native';
  import Pdf from 'react-native-pdf';
  import * as FileSystem from 'expo-file-system';
  import * as Asset from 'expo-asset';
  
  export default function PdfViewer() {
    const [pdfUri, setPdfUri] = useState(null);
  
    useEffect(() => {
      async function loadLocalPdf() {
        // 加载assets目录下的PDF文件
        const pdfAsset = require('./assets/your-document.pdf');
        await Asset.loadAsync(pdfAsset);
        
        // 复制assets文件到本地可访问的文档目录
        const targetUri = FileSystem.documentDirectory + 'your-document.pdf';
        await FileSystem.copyAsync({
          from: pdfAsset.uri,
          to: targetUri,
        });
        
        setPdfUri(targetUri);
      }
      loadLocalPdf();
    }, []);
  
    if (!pdfUri) return <View />;
  
    return (
      <View style={{ flex: 1 }}>
        <Pdf
          source={{ uri: pdfUri }}
          style={{ flex: 1 }}
          onLoadComplete={(pageCount) => console.log(`PDF加载完成，共${pageCount}页`)}
          onError={(err) => console.log('PDF加载出错:', err)}
        />
      </View>
    );
  }
  

  这里要注意：assets里的文件需要先通过expo-asset加载，再复制到本地文档目录——直接用assets的URI给react-native-pdf，大概率会碰权限问题。

• 补全权限配置
  在app.json里添加必要的权限声明，避免iOS隐私合规和安卓权限拦截：

  {
    "expo": {
      "ios": {
        "infoPlist": {
          "NSFileProviderDomainUsageDescription": "需要访问本地文件以加载PDF文档"
        }
      },
      "android": {
        "permissions": ["android.permission.READ_EXTERNAL_STORAGE", "android.permission.WRITE_EXTERNAL_STORAGE"]
      }
    }
  }
  

• 清理缓存重启项目
  执行命令清理Expo和npm缓存，避免旧依赖残留：

  expo r -c
  

  重启项目后应该就能正常加载assets里的PDF了。

另外提一句，就算react-native-fetch-blob改名为rn-fetch-blob，新版本依然不兼容Expo的managed workflow，所以替换成Expo官方库是最稳妥的方案。

内容的提问来源于stack exchange，提问作者King Jherold