如何使用Expo和React Native将Firebase Storage照片保存到手机相册

完全可以通过Expo官方提供的SDK实现需求，无需引入rn-fetch-blob等不兼容的第三方库。

前置准备 #

首先安装两个Expo官方SDK：

npx expo install expo-file-system expo-media-library

同时在app.json中配置权限声明：

• iOS端添加相册写入权限说明：NSPhotoLibraryAddUsageDescription
• Android端添加存储写入权限声明：android.permission.WRITE_EXTERNAL_STORAGE

核心实现逻辑 #

之前调用MediaLibrary.createAssetAsync报错的核心原因是该接口仅接受本地文件URI，且需要文件后缀匹配实际格式，因此需要先将Firebase远程图片下载到本地缓存目录，生成带后缀的本地URI后再调用MediaLibrary接口写入相册。

完整代码示例 #

import * as FileSystem from 'expo-file-system';
import * as MediaLibrary from 'expo-media-library';

// 传入你的Firebase图片URL即可调用
const saveFirebaseImageToGallery = async (firebaseImageUrl) => {
  // 1. 申请存储权限
  const permissionResult = await MediaLibrary.requestPermissionsAsync();
  if (permissionResult.status !== 'granted') {
    alert('请授予存储权限后重试');
    return;
  }

  // 2. 生成本地带后缀的缓存路径，可根据实际图片格式调整后缀
  const localCachePath = `${FileSystem.cacheDirectory}firebase_img_${Date.now()}.jpg`;

  // 3. 下载远程图片到本地缓存
  const downloadResult = await FileSystem.downloadAsync(
    firebaseImageUrl,
    localCachePath
  );

  // 4. 将本地图片写入系统相册
  await MediaLibrary.createAssetAsync(downloadResult.uri);
  alert('图片已成功保存到相册');
};

注意事项 #

• 如果你需要适配多种图片格式，可以先发起Head请求获取图片响应头的content-type字段，动态匹配文件后缀（比如image/png对应.png，image/jpeg对应.jpg）。
• 可选扩展：如果需要将图片保存到自定义命名的相册中，可以在创建Asset后调用MediaLibrary.createAlbumAsync或MediaLibrary.addAssetsToAlbumAsync接口实现。
• 该方案完全兼容Expo Go开发环境与生产打包场景，无需修改任何原生配置。

内容的提问来源于stack exchange，提问作者newbie coder