Javascript 使用身份验证标头发出跨域请求

Javascript 使用身份验证标头发出跨域请求,javascript,api,xmlhttprequest,Javascript,Api,Xmlhttprequest,首先,服务器(不是我的)返回以下标头: Access-Control-Allow-Origin: * Access-Control-Allow-Credentials: true 我试图找出如何使用身份验证令牌将请求传递到站点。我正在本地apache服务器上运行代码 这是我的代码: function get_data(){ var url = '$URL'; var x = new XMLHttpRequest(); x.open("GET", url, true)

首先,服务器(不是我的)返回以下标头:

Access-Control-Allow-Origin: *
Access-Control-Allow-Credentials: true
我试图找出如何使用身份验证令牌将请求传递到站点。我正在本地apache服务器上运行代码

这是我的代码:

function get_data(){
    var url = '$URL';
    var x = new XMLHttpRequest();
    x.open("GET", url, true)
     if (x.readyState == 4 && x.status == 200) {
        var responseText = x.responseText;
        console.log(responseText)
        };
    x.setRequestHeader("Authentication", "Bearer $TOKEN");
    x.withCredentials = true
    x.send()
}
控制台返回:

XMLHttpRequest无法加载$URL。对飞行前请求的响应不正确 通过访问控制检查:未显示“访问控制允许原点”标题 在请求的资源上显示。来源“”是 因此不允许访问。响应的HTTP状态代码为403

在阅读文档时,我发现不允许手动设置标题。当我删除
x.setRequestHeader(“身份验证”、“持票人$TOKEN”)我确实从服务器上得到了一个答案(很明显,这是一个身份验证错误。)那么我该如何将这些信息添加到我的请求中呢

服务器返回的标头:

Request URL:$serverurl
Request Method:OPTIONS
Status Code:403 Forbidden
Remote Address:$ipaddress
Response Headers
view source
Cache-Control:no-cache
Connection:close
Content-Type:text/html
Request Headers
view source
Accept:"*/*"
Accept-Encoding:gzip, deflate, sdch
Accept-Language:nl-NL,nl;q=0.8,en-US;q=0.6,en;q=0.4
Access-Control-Request-Headers:authentication
Access-Control-Request-Method:GET
Connection:keep-alive
Host:$host
Origin:http://localhost
Referer:http://localhost/mv.html
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.2526.111 Safari/537.36

在实际GET请求之前,浏览器会发送一个选项请求,以检查它有哪些“选项”可供请求(允许的方法、来源等)

检查网络选项卡,查看浏览器发送的选项请求(飞行前)。此请求必须具有适当的响应标头,例如

Access-Control-Allow-Origin: *
Access-Control-Allow-Credentials: true
Access-Control-Allow-Methods: POST, GET, OPTIONS
请看这里:


由于服务器为选项请求发送403状态头,这意味着服务器没有正确处理选项请求,或者只是为主机设置403作为安全措施。除非更改,否则无法通过XHR访问该api。

请解释“$URL”的含义。这是真实服务器url的令牌还是占位符?类似地,
$token
-出于隐私原因,我在此处替换了url和令牌,它们正确地放置在我的代码中。值得一提的是,我用Python编写了完全相同的脚本,没有任何问题。