从flutter中的POST请求获取XMLHttpRequest错误

qjp7pelc 于 2023-03-13 发布在 Flutter

关注(0)|答案(3)|浏览(146)

我尝试在flutter中向API发出post请求，当我在命令行中使用cURL时，它可以完美地工作，但flutter中的请求不起作用。尝试了大量不同的请求格式，但都不起作用。
下面是工作的cURL请求：（API正确返回包含YouTube视频详细信息的字符串）

curl -m 70 -X POST <API_URL_HERE> \
-H "Content-Type:application/json" \
-d '{"youtube_link":"https://www.youtube.com/watch?v=gbUfbN7vT20"}'

以下是不工作的Flutter请求：

String link = "https://www.youtube.com/watch?v=gbUfbN7vT20";
var url = Uri.parse("<API_URL_HERE>");
var response = await http.post(url, 
                  body: jsonEncode({"youtube_link": "$link"}), 
                  headers: {"Content-Type": "application/json"}
               );

错误：XMLHttpRequest错误。我检查了接收请求的服务器。对于良好的请求，它返回状态码200，而对于Flutter请求，它返回状态码400（但实际代码中没有发生错误，似乎只是请求有问题）。
更新：好的，这似乎是一个CORS的问题。但是我还没有设法修复它在API端也通过以下说明https://cloud.google.com/functions/docs/writing/http#handling_cors_requests
尽管这可能是另一个问题。

flutter

来源：https://stackoverflow.com/questions/72470503/getting-xmlhttprequest-error-from-post-request-in-flutter

3条答案

按热度按时间

smdncfj31#

解决了这个问题：
API是Google Cloud函数上的一个Python函数（对于不同的API，方法可能会有所不同）
您需要在函数的开头和结尾添加以下代码，以接受来自flutter web的CORS请求。

def function(request):
    if request.method == 'OPTIONS':
        headers = {
            'Access-Control-Allow-Origin': '*',
            'Access-Control-Allow-Methods': 'POST, GET, OPTIONS, PUT, DELETE, HEAD',
            'Access-Control-Allow-Headers': 'custId, appId, Origin, Content-Type, Cookie, X-CSRF-TOKEN, Accept, Authorization, X-XSRF-TOKEN, Access-Control-Allow-Origin',
            'Access-Control-Max-Age': '3600'
        }

        return ('', 204, headers)

    # Set CORS headers for the main request
    headers = {
        'Access-Control-Allow-Origin': '*'
    }

    ------ SOME CODE THAT DOES SOMETHING ------

    return(output,200,headers)

赞(0）回复(0）举报 2023-03-13

sxissh062#

var url = Uri.http(base_url + '/register');

会成功

赞(0）回复(0）举报 2023-03-13

wd2eg0qa3#

您可以使用POST方法以这种方式...用户在我的应用程序中注册的示例

void register(User user) async {

var url = Uri.parse(base_url + '/register');

final http.Response response = await http.post(
  url,
  headers: <String, String>{
    'Content-Type': 'application/json',
    'Accept-Language': 'en-US',
  },
  body: json.encode(user.toJson()),
);

if (kDebugMode) {
  print(response.body.toString());
}
var answer = jsonDecode(response.body);
String returnAnswer = "";
if (response.statusCode == 200) {
  try {
    ////code for success...
  } catch (_) {
    return returnAnswer;
  }
} else {
   ////Code/Message for failer
}}}

赞(0）回复(0）举报 2023-03-13

我来回答

从flutter中的POST请求获取XMLHttpRequest错误

3条答案

相关问题

热门标签

最新问答