uniapp开发app调用fetch失败如何成功调用fetch

在uniapp开发的App中调用fetch接口时遇到失败，具体表现为请求无法正常发送或接收响应。尝试过配置manifest.json中的网络权限和检查URL正确性，但问题依旧。请问如何正确在uniapp中调用fetch？需要设置特定的请求头或跨域配置吗？是否有替代方案或推荐的最佳实践？

2 回复

在uniapp中，使用uni.request替代fetch。因为uniapp不支持原生fetch API。示例代码：

uni.request({
  url: 'https://api.example.com/data',
  method: 'GET',
  success: (res) => {
    console.log(res.data);
  },
  fail: (err) => {
    console.error(err);
  }
});

确保网络权限和域名白名单配置正确。


在uni-app中调用fetch失败，通常是因为uni-app默认不支持浏览器原生的fetch API。以下是几种解决方案：

1. 使用uni.request替代（推荐）

uni-app官方推荐使用uni.request进行网络请求，兼容性更好：

uni.request({
  url: 'https://api.example.com/data',
  method: 'GET',
  success: (res) => {
    console.log('请求成功:', res.data);
  },
  fail: (err) => {
    console.log('请求失败:', err);
  }
});

2. 引入fetch polyfill

如果需要使用fetch，可以安装第三方polyfill：

npm install whatwg-fetch

然后在main.js中引入：

import 'whatwg-fetch';

3. 使用uni-app插件市场中的fetch插件

在uni-app插件市场搜索"fetch"，选择评分较高的插件安装使用。

4. 检查网络权限配置

确保manifest.json中已配置网络请求权限：

{
  "app-plus": {
    "distribute": {
      "android": {
        "permissions": [
          "<uses-permission android:name=\"android.permission.INTERNET\"/>"
        ]
      }
    }
  }
}

常见问题排查：

  1. 检查URL是否为HTTPS（iOS强制要求）
  2. 确认域名已在manifest.json的白名单中
  3. 检查网络连接状态
  4. 查看控制台错误信息

建议优先使用uni.request，这是uni-app生态中最稳定的网络请求方案。

回到顶部