选项（失败）仅在 Chrome 和 Firefox 上

Question

我发出一个 POST 请求，但该请求一直处于等待状态，直到最终失败。我已经监视了 nginx 日志和节点服务器日志，并且请求甚至没有注册。这适用于我测试过的其他任何人，除了另一位同事。如果我使用边缘浏览器或其他计算机，它可以正常工作。

我试图向其他（自定义）服务器发出 POST 请求，它也挂在那里的选项上。我也用 jQuery 发出了 POST 请求，但同样失败了。

值得注意的是，我正在使用 withCredentials 标志。

标题：

Provisional headers are shown
Access-Control-Request-Headers:content-type
Access-Control-Request-Method:GET
Origin:http://localhost:8080
Referer:http://localhost:8080/<path>
User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.84 Safari/537.36

请求：

  public login(user) {
    const endpoint = `http://<url>`;

    let headers = new Headers();
    headers.append('Content-type', 'application/json');

    return this.http
      .post(endpoint, JSON.stringify(user), {
        headers: headers,
      });

  }

我在我的组件中订阅了调用：

this._accountService.login(this.user)
        .subscribe(res => {
            console.log("logged in!");
            if (res.json().status === "success") {
                window.location.href = `/home/${this.org}/${this.product}`;
            }
            else {
                // What other options are there?
                console.log("Do something else maybe?");
            }
        },
        err => {
            this.invalidLogin = true;
            console.log("Ye shall not pass!");
        });

成功用户的标题

Accept:*/*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:content-type
Access-Control-Request-Method:POST
Connection:keep-alive
Host:<url>
Origin:<url>
Referer:<url>
User-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.33 Safari/537.36

来自 chrome://net-internals/#events

t=61869793 [st=    0] +REQUEST_ALIVE  [dt=60162]
                       --> has_upload = false
                       --> is_pending = true
                       --> load_flags = 34624 (DO_NOT_SAVE_COOKIES | DO_NOT_SEND_AUTH_DATA | DO_NOT_SEND_COOKIES | MAYBE_USER_GESTURE | VERIFY_EV_CERT)
                       --> load_state = 14 (WAITING_FOR_RESPONSE)
                       --> method = "OPTIONS"
                       --> net_error = -1 (ERR_IO_PENDING)
                       --> status = "IO_PENDING"
                       --> url = "<url>"
t=61929955 [st=60162]   -HTTP_STREAM_PARSER_READ_HEADERS
                         --> net_error = -324 (ERR_EMPTY_RESPONSE)
t=61929955 [st=60162]   -HTTP_TRANSACTION_READ_HEADERS
                         --> net_error = -324 (ERR_EMPTY_RESPONSE)
t=61929955 [st=60162]   -URL_REQUEST_START_JOB
                         --> net_error = -324 (ERR_EMPTY_RESPONSE)
t=61929955 [st=60162]    URL_REQUEST_DELEGATE  [dt=0]
t=61929955 [st=60162] -REQUEST_ALIVE
                       --> net_error = -324 (ERR_EMPTY_RESPONSE)

我真的猜测这与我的浏览器中缓存的某些内容有关，但我真的找不到什么。我已经清除了所有 cookie 和任何可以存储的东西。我还能在哪里检查以清除东西？这显然是我的计算机/浏览器（以及另一个不幸的人）本地的东西。

Answer 1

请尝试 subscribe() 到 observable。

return this.http
  .post(endpoint, JSON.stringify(user), {
    headers: headers,
  }).subscribe(() => console.log("POST done!"));

Answer 2

您是否尝试在标题中设置“缓存控制”？我认为在 jQuery 中你可以简单地设置

$.ajax({    
  cache: false 
});

或使用常规 ajax 请求添加标头

request.setRequestHeader("Cache-Control", "no-cache"); 

Answer 3

你为什么不阻止进入OPTIONS请求循环。它有时真的让你发疯。其他浏览器不会触发 OPTIONS 请求，但 chrome 和 firefox 会确保 CORS 。我已经成功地使用了这个来自 github 的名为 xdomain 的库，它确实有效！他们的 github 介绍页面将 xdomain 介绍为 CORS alternative 。最重要的是我在 JQuery 中使用了它，但它也支持 Angular 的 http 服务。看看它 。它可能对你有好处:)。这是图书馆的链接Xdomain CORS Alternative

Answer 4

CORS 和使用 localhost 作为域（您已在 ORIGIN 标头中列出）存在问题。通常，当涉及到localhost 时，出于某些安全原因，CORS / OPTIONS 请求无法正常工作，但挂起通常不会发生，因此这可能不是正确的答案，但值得一试！

尝试将新主机添加到本地计算机并从等式中删除 localhost。只是把这个想法扔在那里，希望它可以帮助你！

根据下面的评论

您的服务器似乎允许连接，但似乎没有发送响应。您能否发布成功的 OPTIONS 请求的标头，以证明服务器确实能够处理这些请求。