React Native iOS端加载assets-library图片链接报错问题咨询

嘿，我碰到过类似的问题，咱们先理清楚为啥iOS会报错而Android正常：

React Native 0.60+版本开始，iOS端的RCTImageLoader已经不再默认支持assets-library://这个协议了——苹果早就逐步废弃了这个旧的相册资源协议，转而推荐使用ph://（Photos框架专属URL）或者直接获取本地文件路径。而Android端的内容解析器还能兼容这类URL，所以没出问题。

给你几个靠谱的解决办法，按优先级排序：

1. 优先改用本地文件路径加载（最推荐） #

你可以用像react-native-image-picker或者react-native-document-picker这类成熟的库，在选择图片时直接获取file://开头的本地路径，而不是assets-library://的URI。这样RN的Image组件（包括ImageBackground）就能直接识别加载了。

举个用react-native-image-picker的示例：

import ImagePicker from 'react-native-image-picker';

// 封装选择图片的函数
const pickGalleryImage = () => {
  const pickerOptions = {
    mediaType: 'photo', // 只选图片
    quality: 0.8, // 图片质量
    allowsEditing: false, // 不需要编辑的话可以关掉
  };

  ImagePicker.launchImageLibrary(pickerOptions, (response) => {
    if (!response.didCancel && !response.error) {
      // 这里拿到的uri在iOS是file://开头，Android也能兼容
      const validImageUri = response.uri;
      // 把这个uri赋值给你的item.uri即可
      // 比如 setState({ selectedImage: { uri: validImageUri } })
    }
  });
};

2. 改用Photos框架的ph://协议URL #

如果需要保留相册资源的引用，可以使用react-native-photos-framework这类库来获取ph://开头的URL，RN的ImageLoader是支持这个协议的。不过要记得在Info.plist里配置好相册访问权限：

<key>NSPhotoLibraryUsageDescription</key>
<string>需要访问你的相册来加载图片</string>

3. 不推荐：手动添加assets-library协议支持（临时救急） #

如果因为某些原因必须要用assets-library://，你需要修改RN的原生代码：

• 找到iOS项目里的RCTImageLoader.mm文件
• 在RCTImageLoader的supportedURLSchemes方法里添加assets-library这个scheme
  不过要注意，苹果在新版本iOS系统可能会限制这个协议的使用，而且RN后续版本大概率会彻底移除相关支持，所以这个方法只适合临时救急。

最后提醒下：不管用哪种方法，都要确保你的iOS项目已经配置了相册访问权限，否则会出现权限报错哦。

内容的提问来源于stack exchange，提问作者amir gh