Firefox 和 Internet Explorer 在 OPTIONS 请求后收到 200 OK 后不发送 POST 请求 - 在 Chrome 中工作正常 [英] Firefox and Internet Explorer not sending POST request after receiving 200 OK after OPTIONS request - Works fine in Chrome

问题描述

我正在开发一项新服务，其中我在 C++ 应用程序中内置了 REST API.C++ 应用程序侦听特定端口并接收 HTTP/S 流量，处理发送的内容，然后发回 HTTP 响应.

I am working on a new service where I have a REST API built inside a C++ application. The C++ applications listens on a particular port and receives HTTP/S traffic, processes what is sent, and then send an HTTP response back.

这个想法是我将拥有不同的库，这些库将能够在 C++ API 中发布 REST API.我可以从任何地方和任何地方获取请求，因此它可能是另一种软件，例如通过 CURL，或来自浏览器的 POST 请求.

The idea is that I will have different libraries that will be able to post REST API within the C++ API. I can be getting a request from any where and anything, so it could be another bit of software, via CURL for example, or a POST request from a browser.

API 一直在工作，直到我开发一个库，该库将与 Javascript 一起使用，通过 AJAX 帖子发送 C++ API 请求.

The API is working until I was working on a library that would be used with Javascript to send the C++ API request via AJAX posts.

因为我正在从一个网站向另一个域发送 AJAX 帖子，所以我不得不使用 CORS.当我第一次开始设计它时，我使用的是 Chrome，我遇到了一个问题，即 Chrome 会发送 HTTP OPTIONS 请求，我会用 403 Method Not Allowed 响应，因为我当时不知道这一点.我查看了这个并找到了需要的东西，然后让它工作，所以 Chrome 会发送 OPTIONS 请求，C++ 应用程序会发送 200 OK，然后 Chrome 会发送实际的 AJAX POST.

Because I am doing an AJAX post from one website to another domain I am having to make use of CORS. When I first started designing this I was using Chrome and I hit a problem that Chrome would send an HTTP OPTIONS request and I would respond with a 403 Method Not Allowed as I didn't know about this at the time. I looked into this and found what was needed and then got it working so Chrome would send the OPTIONS request, the C++ app would send a 200 OK, and Chrome would then subsequently send the actual AJAX POST.

这在 Chrome 中完全有效，但是，在 Internet Explorer 和 Firefox 中测试时，浏览器发送 OPTIONS，C++ 应用程序发送回 200 OK，但随后两个浏览器都没有发送实际的 POST 请求.

This is fully working in Chrome, however, when testing in Internet Explorer, and Firefox the browser sends the OPTIONS, and the C++ app sends back a 200 OK but then neither of the browers send the actual POST request.

以下是来自 Chrome 和 Firefox 的请求标头和响应标头.

Below are the request headers and response headers from Chrome and Firefox.

Chrome 请求标头

Request URL: http://192.168.1.96:500/initialise
Request Method: OPTIONS

Remote Address: 192.168.1.96:500
Referrer Policy: no-referrer-when-downgrade
Provisional headers are shown
Access-Control-Request-Headers: authorisation-token,device_id,session_id
Access-Control-Request-Method: POST
Origin: http://localhost
User-Agent: Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Mobile Safari/537.36

Chrome 响应标头

    Access-Control-Allow-Headers: * 
    Access-Control-Allow-Methods: POST, OPTIONS 
    Access-Control-Allow-Origin: * 
    Access-Control-Expose-Headers: session_id 
    Allow: POST,OPTIONS 
    Content-Length: 0 
    Content-Type: application/json
    Status Code: 200 OK

Firefox 请求标头

Accept: text/html,application/xhtml+xm…plication/xml;q=0.9,*/*;q=0.8
Accept-Encoding gzip, deflate
Accept-Language: en-GB,en;q=0.5
Access-Control-Request-Headers: authorisation-token,device_id,session_id
Access-Control-Request-Method: POST
Connection: keep-alive
Host: 192.168.1.96:500
Origin: http://localhost
Referer: http://localhost/_js/
User-Agent: Mozilla/5.0 (Windows NT 10.0; …) Gecko/20100101 Firefox/64.0
Request URL:http://192.168.1.96:500/initialise
Request method:OPTIONS
Remote address:192.168.1.96:500

Firefox 响应标头

Access-Control-Allow-Headers: *
Access-Control-Allow-Methods: POST, OPTIONS
Access-Control-Allow-Origin: *
Access-Control-Expose-Headers: session_id
Allow: POST,OPTIONS
Content-Length: 0
Content-Type: application/json
Status code:200

以下是我如何处理 ajax 请求的参考:

For reference below is how I am doing the ajax request:

var url = "http://192.168.1.96:500/";
        url += api_endpoint;

        $.ajax({
            type: "POST",
            url: url,
            async: true,
            headers: {
                "authorisation-token": app.api_key,
                "session_id": app.cookie,
                "device_id": app.device_id
            },
            data: postArray,
            crossDomain: true,
            success: function(object, status, xhr){
                if (api_endpoint === "initialise")
                {
                    app.cookie = xhr.getResponseHeader("session_id");
                    setCookie("session_id", app.cookie, true);
                }
                if (callbackResult !== null)
                {
                    callbackResult(object);
                }
            },
            error: function(xhr)
            {
                console.error("Status: " + xhr.status);
                console.error("Status Text:" + xhr.statusText);
                console.error("Response Text: " + xhr.responseText);
                if (callbackResult !== null)
                {
                    callbackResult(xhr);
                }
            }
        });

我正在使用 Jquery 来执行 ajax 帖子.

I am using Jquery to perform the ajax post.

谁能明白为什么在这种情况下 Firefox 在 200 OK 之后不会发送实际请求，请求和响应看起来是一样的，这在 Google Chrome 中完美运行.

Can anyone see why in this case Firefox wouldn't be sending the actual request after the 200 OK, the request and the response looks to be the same and this works perfectly in Google Chrome.

推荐答案

感谢@Manoj Purohit 的评论，我想通了再次检查控制台.我这样做了，发现有一些警告已被过滤，我不得不添加以下标题以使其在 Firefox 和 Internet 中工作 - 尽管它在 Chrome 中被接受，但很奇怪.

I've figured out thanks to @Manoj Purohit comment to check the console again. I did that and found there were warnings which had been filtered, I had to add the following header to make it work in Firefox and Internet - odd though that it was accepted in Chrome.

this->addHeader("Access-Control-Allow-Headers", "authorisation-token, device_id, session_id");

这篇关于Firefox 和 Internet Explorer 在 OPTIONS 请求后收到 200 OK 后不发送 POST 请求 - 在 Chrome 中工作正常的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！