jQuery AJAX 标头授权答案

【问题标题】：jQuery AJAX Header AuthorisationjQuery AJAX 标头授权
【发布时间】：2012-07-18 11:18:02
【问题描述】：

我正在尝试授权基于 this tutorial 的 AJAX 查询。它使用 Crypto 库在发送之前使用适当的授权信息设置请求标头。我遇到的问题是标题似乎没有按要求设置。这是我的代码：

beforeSend : function(xhr) {
  var bytes = Crypto.charenc.Binary.stringToBytes(username + ":" + password);
  var base64 = Crypto.util.bytesToBase64(bytes);
  xhr.setRequestHeader("Authorization", "Basic " + base64);
},

【问题讨论】：

是什么让你觉得没有设置标题？你检查过实际的 xhr 调用吗？可以将Crypto、username 或password 设置为undefined 吗？您还可以使用 curl 并设置标头 (-H) 并查看是否不是服务器端问题。顺便说一句，我是写那篇博文的人 ;-)
我正在将 xhr 调用写入日志，我在对象中寻找什么？我已经检查过了，所有 3 个都定义正确。当前发生的情况是由于显而易见的原因，我收到了 401 未经授权的错误。很高兴知道，好帖子。
使用 Chrome，如果您打开开发者工具并选择网络选项卡，然后在底部列表中选择 XHR 元素，您可以检查实际的 ajax 请求、其内容、标头和所有内容。跨度>

标签： jquery webtrends

【解决方案1】：

问题在于未将dataType 设置为JSONP。由于这没有完成，浏览器将调用解释为标准 AJAX 请求，这意味着它在同源策略下被阻止。

工作代码供参考（感谢 @pdeschen 建议 Crpyto）：

<script type='text/javascript'>
// define vars
var username = '';
var password = '';
var url = '';

// ajax call
$.ajax({
    url: url,
    dataType : 'jsonp',
    beforeSend : function(xhr) {
      // generate base 64 string from username + password
      var bytes = Crypto.charenc.Binary.stringToBytes(username + ":" + password);
      var base64 = Crypto.util.bytesToBase64(bytes);
      // set header
      xhr.setRequestHeader("Authorization", "Basic " + base64);
    },
    error : function() {
      // error handler
    },
    success: function(data) {
        // success handler
    }
});
</script>

【讨论】：

您也可以使用btoa(username+":"+password)将用户名和密码编码为base64
@DanielHigueras 不错！不知道这个功能，[看起来它只在 IE 10+ 中可用]，但是嘿.. 拧 IE ?

【解决方案2】：

这终于似乎对我有用。个别呼叫可能会发生冲突。将此方法设置为未来连接选项的默认值。

//Function( jqXHR jqXHR )
$.ajaxSetup( {beforeSend: function(jqXHR) {
    jqXHR.setRequestHeader( "My-Header", "My-Value" );
} } );

【讨论】：

看来ajaxSetup已经不存在了，所以我用了ajaxSend：$(document).ajaxSend(function(e, xhr, settings) { xhr.setRequestHeader("Authorization", "mytoken"); });。见api.jquery.com/ajaxSend