React Native Camera：拍照后如何将图片保存至应用内部而非系统相册？

嘿，刚好之前处理过类似的需求，给你分享下具体的实现步骤——核心思路是绕过默认的系统相册保存逻辑，先获取图片的临时数据/路径，再通过文件操作库将其转移到应用的私有目录。

步骤1：安装文件操作依赖 #

我们需要用react-native-fs来处理文件系统的复制/移动操作，先安装它：

# npm 安装
npm install react-native-fs --save

# 或者 yarn
yarn add react-native-fs

注：React Native 0.60+ 版本会自动链接依赖，低版本需要手动执行react-native link react-native-fs

步骤2：修改拍照逻辑，关闭自动存相册 #

默认情况下takePictureAsync会把图片存到系统相册，我们需要设置saveToCameraRoll: false来禁用这个行为，同时获取图片的临时路径：

import RNCamera from 'react-native-camera';
import RNFS from 'react-native-fs';

// 组件内的拍照方法
const takePicture = async () => {
  if (!this.camera) return;

  try {
    // 配置拍照选项：不存相册，获取临时路径
    const captureOptions = {
      quality: 0.8, // 图片质量，0-1之间
      saveToCameraRoll: false, // 关键：关闭自动保存到系统相册
      base64: false, // 如果不需要base64可以设为false，节省内存
    };

    // 执行拍照，获取临时文件信息
    const capturedImage = await this.camera.takePictureAsync(captureOptions);
    
    // 定义私有目录的目标路径
    // RNFS.DocumentDirectoryPath 是应用的私有文档目录，卸载应用会被删除
    const targetFilePath = `${RNFS.DocumentDirectoryPath}/captured_photo_${Date.now()}.jpg`;

    // 把临时文件复制到目标路径
    await RNFS.copyFile(capturedImage.uri, targetFilePath);

    console.log('图片已成功保存到私有目录：', targetFilePath);
    // 这里可以做后续操作，比如记录路径到本地存储、显示图片等
  } catch (error) {
    console.error('保存图片失败：', error);
  }
};

可选：用Base64数据保存图片 #

如果你更倾向于用Base64格式处理图片，也可以这样做：

const takePictureWithBase64 = async () => {
  if (!this.camera) return;

  try {
    const captureOptions = {
      quality: 0.8,
      saveToCameraRoll: false,
      base64: true, // 开启base64输出
    };

    const capturedImage = await this.camera.takePictureAsync(captureOptions);
    const targetFilePath = `${RNFS.DocumentDirectoryPath}/captured_photo_${Date.now()}.jpg`;

    // 将Base64数据写入文件
    await RNFS.writeFile(targetFilePath, capturedImage.base64, 'base64');

    console.log('Base64图片已保存到私有目录：', targetFilePath);
  } catch (error) {
    console.error('保存失败：', error);
  }
};

关于私有目录的说明 #

• RNFS.DocumentDirectoryPath：应用的私有文档目录，只有当前应用可访问，卸载应用时会被彻底删除，适合存储用户的重要数据（比如拍摄的专属图片）。
• RNFS.CachesDirectoryPath：应用的缓存目录，系统可能在存储空间不足时自动清理，适合存储临时图片或缓存文件。

内容的提问来源于stack exchange，提问作者Abhilash Reddy