javascript - 使用AJAX发送POST消息问题

Question

我目前正在尝试发送一条 POST 消息，该消息工作正常，除了出现没有正确凭据的错误。但是，在我添加凭据 header 后，消息类型更改为 OPTIONS 并失败。我不明白添加 header 如何导致类型更改为 OPTIONS。任何帮助将不胜感激。

    ajaxRequest = $j.ajax({
                       url: url,
                       type: 'POST',
                      beforeSend : function(req) {
                           req.setRequestHeader('Authorization', auth),
                      }
                       success: function(data, status) {
                           console.log("Success!!");
                           console.log(data);
                           console.log(status);
                           },
                       error: function(xhr, desc, err) {
                           console.log(xhr);
                           alert('fail')
                          console.log("Desc: " + desc + "\nErr:" + err);
                           }

                    });

编辑:为了更清楚，我可以直接进入并注释掉 setRequestHeader 函数，它会发送消息 POST。

Answer 1

您遇到的问题是由于使用 AJAX 时的跨域限制造成的。当您尝试设置授权 header 时，浏览器会发出所谓的预检请求，以查看服务器是否接受来自该域的请求。

飞行前请求通常作为 OPTIONS 请求发送。如果您调用的服务器未返回与您的域匹配的 Access-Control-Allow-Origin header ，则 AJAX 请求将被阻止。 这里有更多信息:Cross-Origin Resource Sharing

“用户代理可以通过预检请求发现跨源资源是否准备好使用非简单方法接受来自给定源的请求。”

我遇到了同样的问题 - 根据您的情况，有一些可能的解决方法。 如果您有任何方法在第 3 方服务器上设置上述 header (某些应用程序/服务提供此功能)，那么这可能是最简单的方法。

还有一个名为 EasyXDM 的 javascript 库这可能对您有用，但同样，只有当您有权访问第三方服务器并上传该库的配置文件时，它才有用。

其他要研究的选项是 PostMessage 和跨域 Iframe 通信。后者更像是一种老式的黑客方法，前者是较新浏览器的推荐方法。它不适用于 IE6/7。

我们可能最终使用的选项是一个简单的代理 - 使用 AJAX 请求调用我们自己的服务器，并在服务器上调用第 3 方服务器。这完全避免了跨域问题，并且对于我们的场景还有其他优势。