as

Settings
Sign out
Notifications
Alexa
亚马逊应用商店
AWS
文档
Support
Contact Us
My Cases
新手入门
设计和开发
应用发布
参考
支持

expo-file-system

expo-file-system

@amazon-devices/expo-file-system提供对设备文件系统的访问权限。它还能够从网络URL下载和上传文件。

安装

  1. package.json文件中添加JavaScript库依赖项。

    已复制到剪贴板。

     "dependencies": {
     ...
     "@amazon-devices/expo-file-system": "~2.0.0",
     "expo": "~50.0.0",
     ...
     }
    
  2. 使用npm install命令重新安装依赖项。

示例

下面的示例演示了如何将文本写入文件。

已复制到剪贴板。

import React, {useEffect, useState} from 'react';
import {Alert, Button, StyleSheet, Text, View} from 'react-native';
import * as FileSystem from '@amazon-devices/expo-file-system';

export const App = () => {
  const [fileContent, setFileContent] = useState<string | null>(null);
  const fileUri = FileSystem.documentDirectory + 'sample.txt';

  useEffect(() => {
    (async () => {
      const fileInfo = await FileSystem.getInfoAsync(fileUri);
      if (fileInfo.exists) {
        const content = await FileSystem.readAsStringAsync(fileUri);
        setFileContent(content);
      } else {
        setFileContent('文件不存在 - 您需要写入文件');
      }
    })();
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);

  const writeFile = async () => {
    try {
      await FileSystem.writeAsStringAsync(fileUri, '欢迎使用文件系统!');
      Alert.alert('文件写入成功!');
    } catch (error) {
      console.error('写入文件时出错:', error);
    }
  };

  const readFile = async () => {
    try {
      const content = await FileSystem.readAsStringAsync(fileUri);
      setFileContent(content);
    } catch (error) {
      console.error('读取文件时出错:', error);
    }
  };

  return (
    <View style={styles.container}>
      <Text style={styles.text}>File Content: {fileContent}</Text>
      <Button title="写入文件" onPress={writeFile} />
      <Button title="读取文件" onPress={readFile} />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: 'white',
  },
  text: {
    fontSize: 30,
    textAlign: 'center',
  },
});

以下示例演示如何下载或上传文件。

已复制到剪贴板。

import * as FileSystem from '@amazon-devices/expo-file-system';
import {DownloadOptions, FileSystemUploadOptions} from '@amazon-devices/expo-file-system';
import React, {useState} from 'react';
import {Button, ScrollView, StyleSheet, Text, View} from 'react-native';

export const App = () => {
  const downloadAsyncArgs: {
    uri: string;
    fileUri: string;
    options: DownloadOptions;
  } = {
    uri: 'https://httpbin.org/get',
    fileUri: FileSystem.documentDirectory + 'downloadResponse.json',
    options: {
      md5: true,
      cache: false,
      headers: {
        Accept: 'application/json',
      },
    },
  };
  const uploadAsyncArgs: {
    url: string;
    fileUri: string;
    options: FileSystemUploadOptions;
  } = {
    url: 'https://httpbin.org/patch',
    fileUri: FileSystem.documentDirectory + 'downloadResponse.json',
    options: {
      fieldName: 'data',
      httpMethod: 'PATCH',
      uploadType: FileSystem.FileSystemUploadType.BINARY_CONTENT,
      headers: {
        Accept: 'application/json',
      },
    },
  };

  const [downloadResponse, setDownloadResponse] =
    useState<FileSystem.FileSystemDownloadResult>();
  const [uploadResponse, setUploadResponse] =
    useState<FileSystem.FileSystemUploadResult>();

  const handleDownloadAsync = async () => {
    const {uri, fileUri, options} = downloadAsyncArgs;
    FileSystem.downloadAsync(uri, fileUri, options)
      .then(setDownloadResponse)
      .catch((error) => setDownloadResponse(error.message));
  };

  const handleUploadAsync = async () => {
    const {url, fileUri, options} = uploadAsyncArgs;
    FileSystem.uploadAsync(url, fileUri, options)
      .then(setUploadResponse)
      .catch((error) => setUploadResponse(error.message));
  };

  return (
    <ScrollView style={styles.container}>
      <Button title="下载文件" onPress={handleDownloadAsync} />
      <View style={styles.cell}>
        <Text style={styles.cellText}>
          {JSON.stringify(downloadResponse, null, 2)}
        </Text>
      </View>

      <Button title="上传文件" onPress={handleUploadAsync} />
      <View style={styles.cell}>
        <Text style={styles.cellText}>
          {JSON.stringify(uploadResponse, null, 2)}
        </Text>
      </View>
    </ScrollView>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    padding: 20,
    backgroundColor: 'white',
  },
  cell: {
    flex: 1,
    padding: 10,
    borderWidth: 2,
    justifyContent: 'center',
    borderColor: 'white',
  },
  cellText: {
    fontSize: 24,
    color: 'black',
  },
});

API参考

查看文档页面,了解有关此库、API参考等的信息:针对expo-file-system的官方Expo文档(仅提供英文版)。

常量

常量 描述
documentDirectory 指向存储此应用用户文档的目录的URI,例如/data/
cacheDirectory 指向将存储此应用所用临时文件的目录的URI,例如/cache/
bundleDirectory 指向存储与应用程序捆绑的资产的目录的URI,例如/pkg/bundle/index.hermes.bundle

方法

方法 描述
copyAsync 创建文件或目录的副本。
deleteAsync 删除文件或目录。
downloadAsync 将远程URI中的内容下载到应用文件系统的文件中。
getContentUriAsync 获取file:// URI并将其转换为内容URI (content://),这样Expo之外的其他应用程序就可以访问它。
getFreeDiskStorageAsync 获取可用的内部磁盘存储大小,以字节为单位。
getInfoAsync 获取有关文件、目录或外部内容/资产的元数据信息。
getTotalDiskCapacityAsync 获取内部磁盘存储总大小,以字节为单位。
makeDirectoryAsync 创建一个新的空目录。
moveAsync 将文件或目录移动到新位置。
readAsStringAsync 将文件的全部内容作为字符串读取。
readDirectoryAsync 枚举目录的内容。
uploadAsync fileUri所指向的文件内容上传到远程url。
writeAsStringAsync 将文件的全部内容作为字符串写入。

支持的URI方案

在此表中,您可以看到每种方法可以处理哪种类型的URI。

方法名称 支持的URI
getInfoAsync 没有方案,例如/data/file.txt
readAsStringAsync 没有方案
writeAsStringAsync 没有方案
deleteAsync 没有方案
moveAsync 来源:没有方案;目的地:没有方案
copyAsync 来源:没有方案;目的地:没有方案
makeDirectoryAsync 没有方案
readDirectoryAsync 没有方案
downloadAsync 来源:http://https://;目的地:没有方案
uploadAsync 来源:没有方案;目的地:http://https://
createDownloadResumable 来源:http://https://;目的地:没有方案

实现详情

在Vega上getTotalDiskCapacityAsync总是返回0

此外,Vega不支持以下类:

  • DownloadResumable
  • FileSystemCancellableNetworkTask
  • UploadTask

支持的版本

程序包版本 基于 @amazon-devices/react-native-kepler版本
2.0.x 15.8.0 2.0.x

其他资源

有关其他库的信息,请参阅支持的第三方库和服务


Last updated: 2025年9月30日