Flutter web Http post请求无法使用http包

Posted 2023-02-23

【中文标题】Flutter web Http post请求无法使用http包

【英文标题】：Flutter web Http post request not working using http package

【发布时间】：2021-03-31 16:59:27

【问题描述】：

在 Flutter Web 上发出 http post 请求失败。我正在使用 http 包发出请求，这是我的代码：

http.post(
      'http://x.x.x.x:5000',
      headers: <String, String>
        "Access-Control-Allow-Origin": "*", // Required for CORS support to work
        "Access-Control-Allow-Credentials":
            'true', // Required for cookies, authorization headers with HTTPS
        "Access-Control-Allow-Headers":
            "Origin,Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token",
        "Access-Control-Allow-Methods": "POST, OPTIONS"
      ,
      body: jsonEncode(<String, String>
        'title': 'title',
      ),
    )

错误：XMLHttpRequest 错误。 dart-sdk/lib/_internal/js_dev_runtime/patch/core_patch.dart 906:28 获取当前 包/http/src/browser_client.dart 84:22 dart-sdk/lib/async/zone.dart 1450:54 runUnary dart-sdk/lib/async/future_impl.dart 143:18 handleValue dart-sdk/lib/async/future_impl.dart 696:44 handleValueCallback

注意：在 chrome 开发工具中，我可以看到 2 个请求通过一个是我的发布请求，我不知道另一个。另一个总是以 200 状态成功并在服务器上记录，但这不是我的发布请求。

【参考方案1】：

在浪费时间寻找解决方案后，我发现我没有在服务器端实现 CORS。我正在使用 Flask 服务器并添加 CORS 很快解决了这个问题。

【参考方案2】：

这是一个服务器端问题。

在 Cpanel 中启用 CORS 以在您的主机帐户中启用 CORS。您可以通过在主机帐户的 .htaccess 文件中添加以下行来启用它。