uni-app 打包app无法获取本地静态资源 Fetch API cannot load f

| 开发环境 | 版本号 | 项目创建方式 |
|----------|--------|--------------|
| HBuilderX | 3.99   | 云端         |

产品分类：HTML5+

手机系统：Android

手机系统版本号：Android 14

手机厂商：vivo

手机机型：14

打包方式：云端

---

### 示例代码：
```p
h5 app  里面Fetch API  无法获取到本地静态资源

操作步骤：

Fetch

预期结果：

Fetch (file:///storage/emulated/0/Android/data/io.dcloud.HBuilder/apps/HBuilder/www/Fulite.wasm)

实际结果：

Fetch API cannot load file:///storage/emulated/0/Android/data/io.dcloud.HBu....

bug描述：

Fetch API cannot load file:///storage/emulated/0/Android/data/io.dcloud.HBuilder/apps/HBuilder/www/Fulite.wasm. URL scheme "file" is not supported. at webpack://demo/./node_modules/vconsole/dist/vconsole.min.js?:9650

wuwangju 1楼•6 天前

我将本地静态资源放到static目录下是可以正常访问到的。您是在使用vconsole中出现了这个问题是吗，应该是他们的静态文件引入不符合我们的规范，你可以先用这个替代方案试试：https://ext.dcloud.net.cn/plugin?id=6147

h691938207 2楼•6 天前

在使用 uni-app 打包成 App 时，如果遇到 Fetch API cannot load 的错误，通常是因为在 App 环境中，无法直接通过 fetch 或 XMLHttpRequest 请求本地静态资源。这是因为在 App 环境中，本地静态资源的路径与 Web 环境不同。

解决方案

使用 uni-app 提供的 API 访问本地资源： uni-app 提供了 uni.getFileSystemManager() 方法来访问本地文件系统。你可以使用这个方法来读取本地静态资源。

const fs = uni.getFileSystemManager();
fs.readFile({
  filePath: '/static/your-file.txt', // 本地文件路径
  encoding: 'utf8',
  success(res) {
    console.log(res.data); // 文件内容
  },
  fail(err) {
    console.error(err);
  }
});

使用 uni-app 的 require 或 import 引入静态资源：如果你需要在代码中引入静态资源（如图片、JSON 文件等），可以使用 require 或 import 语句。
```
const data = require('@/static/your-file.json');
console.log(data);
```

使用 uni-app 的 plus.io API：在 App 环境中，你可以使用 plus.io API 来访问本地文件系统。

plus.io.resolveLocalFileSystemURL('_www/static/your-file.txt', function(entry) {
  entry.file(function(file) {
    const reader = new plus.io.FileReader();
    reader.onloadend = function(evt) {
      console.log(evt.target.result); // 文件内容
    };
    reader.readAsText(file);
  });
});

检查文件路径：确保你在代码中使用的文件路径是正确的。在 App 环境中，静态资源通常位于 _www 目录下，因此路径可能需要调整。
```
const filePath = '_www/static/your-file.txt';
```

使用 uni-app 的 uni.downloadFile 下载远程资源：如果你需要从远程服务器获取资源，可以使用 uni.downloadFile 方法。

uni.downloadFile({
  url: 'https://example.com/your-file.txt',
  success(res) {
    if (res.statusCode === 200) {
      console.log('文件下载成功', res.tempFilePath);
    }
  },
  fail(err) {
    console.error('文件下载失败', err);
  }
});