React Native PDF 组件在 Android 11+ 上的文件访问问题解决方案

在 React Native 开发中，使用 react-native-pdf 组件显示 PDF 文件时，开发者可能会遇到 Android 11 及以上版本的权限问题导致空白屏幕的情况。本文将深入分析问题原因并提供完整的解决方案。

问题背景

当应用尝试直接访问设备存储中的 PDF 文件时（如 /storage/emulated/0/Download/ 目录下的文件），在 Android 11 及以上版本会出现无法加载的问题，即使已经声明了 READ_EXTERNAL_STORAGE 权限。这是由于 Android 11 引入的存储访问限制（Scoped Storage）导致的。

根本原因分析

Android 11 对文件系统访问实施了更严格的限制：

1. Scoped Storage 机制限制了应用对共享存储空间的直接访问
2. 即使声明了传统存储权限，应用也只能访问特定媒体类型文件
3. 非媒体文件（如 PDF）需要特殊权限才能访问

解决方案

方案一：使用文件选择器（推荐）

最安全的方式是让用户主动选择文件：

// 使用文档选择器让用户主动授权
const pickDocument = async () => {
  try {
    const res = await DocumentPicker.pick({
      type: [DocumentPicker.types.pdf],
    });
    const source = {uri: res.uri};
    // 使用source渲染PDF
  } catch (err) {
    console.log(err);
  }
};

方案二：申请 MANAGE_EXTERNAL_STORAGE 权限（需谨慎）

对于必须自动访问文件的场景：

1. 在 AndroidManifest.xml 中添加：

<uses-permission android:name="android.permission.MANAGE_EXTERNAL_STORAGE" />

2. 使用 manage-external-storage 库请求权限：

import ManageExternalStorage from 'manage-external-storage';

// 检查并请求权限
const requestStoragePermission = async () => {
  const hasPermission = await ManageExternalStorage.hasPermission();
  if (!hasPermission) {
    await ManageExternalStorage.requestPermission();
  }
};

3. 确保在访问文件前已获得权限

注意事项

1. Google Play 对 MANAGE_EXTERNAL_STORAGE 权限有严格审核，需充分说明使用理由
2. 考虑在应用商店提交时准备详细的权限使用说明
3. 对于大多数场景，方案一（文件选择器）是更优选择
4. 测试时需在 Android 11+ 设备上验证

最佳实践建议

1. 优先考虑让用户主动选择文件的方式
2. 如必须自动访问，考虑将文件放在应用私有目录
3. 实现完善的错误处理和用户提示
4. 针对不同 Android 版本实现差异化处理

通过以上方案，开发者可以解决 react-native-pdf 在 Android 11+ 上的文件访问问题，确保 PDF 文件能够正常显示。