【问题标题】:cross-origin 'Authorization'-header with jquery.ajax()带有 jquery.ajax() 的跨域“授权”标头
【发布时间】:2012-03-22 12:42:18
【问题描述】:

我正在尝试发送跨域域并添加自定义“授权”标头。 请看下面的代码。

错误:

XMLHttpRequest 无法加载 {url}。 Access-Control-Allow-Headers 不允许请求头域 Authorization。

function loadJson(from, to) {
    $.ajax({
        //this is a 'cross-origin' domain
        url : "http://localhost:2180/api/index.php",
        dataType : 'json',
        data : { handler : "statistic", from : from, to : to
        },
        beforeSend : setHeader,
        success : function(data) {
            alert("success");
        },
        error : function(jqXHR, textStatus, errorThrown) {
            alert("error");
        }
    });
}

function getToken() {
    var cookie = Cookie.getCookie(cookieName);
    var auth = jQuery.parseJSON(cookie);
    var token = "Token " + auth.id + ":" + auth.key;
}

function setHeader(xhr) {
    xhr.setRequestHeader('Authorization', getToken());
}

我也试过了:

headers : { 'Authorization' : getToken() },

在 ajax 请求中。

会不会是 jquery-ajax 框架阻止了跨域认证?我该如何解决这个问题?

更新:

顺便说一句:有没有更安全的方法将 auth.key 存储在客户端然后存储在 cookie 中? getToken() 将被替换为更复杂的方法,对正文、日期等进行哈希处理。

【问题讨论】:

  • 你的getToken()method 没有返回任何东西。

标签: javascript jquery ajax cross-domain


【解决方案1】:

这是发出 CORS 请求的示例。如果您有权访问服务器(我假设您这样做,因为这是对 localhost 的请求),您将需要添加特定于 CORS 的响应标头。最简单的做法是添加以下响应标头:

Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, POST, PUT, DELETE
Access-Control-Allow-Headers: Authorization

您的服务器还需要配置为响应 HTTP OPTIONS 请求。您可以在此处了解有关发出 CORS 请求的更多信息:http://www.html5rocks.com/en/tutorials/cors/

【讨论】:

  • 嗯.. 我忘记了这三个标题中的最后一个。我只是发送来源和方法。愚蠢的错误。 :) 是的,我实现了 OPTIONS。好链接!谢谢
  • 根据 MDN,当使用凭证请求而不是通配符时,需要将 Access-Control-Allow-Origin 标头设置为来源。
  • @radicalmatt,是的,他也写在那里 stackoverflow.com/a/15254158/632951“当 Access-Control-Allow 时,值 * 不能用于 Access-Control-Allow-Origin 标头-凭据为真"
猜你喜欢
  • 2014-02-16
  • 2019-05-29
  • 2019-11-03
  • 2014-12-25
  • 1970-01-01
  • 2018-09-10
相关资源
最近更新 更多