我试图得到一个基本的API调用工作,但API提供商不提供任何开发人员的支持。它们要求每个调用发送一个base64基本身份验证头。当我使用他们的在线API测试工具时,我的密钥是有效的,但我不能让它在我自己的代码或JSFiddle.net中工作。我甚至试图复制"Authentication: Basic ...."值,该值是从我的代码中的测试实用程序返回的,并且不起作用。
我看过Stackoverflow中的许多例子,我对其他api使用类似的代码没有问题。base64基本验证对我来说是新的,当我在IE中运行代码时,调试器会显示我找不到的语法错误。如果发生任何错误,我预计会出现401错误。
对这个错误有什么想法或其他方法来调试它吗?
$(document).ready(function() {
var mySecret = "somevalue";
var myClientId = "somevalue";
$.ajax({
url: "https://www.udemy.com/api-2.0/courses/",
type: 'GET',
dataType: "json",
contentType: "text/plain",
beforeSend: function (xhr) {
xhr.setRequestHeader("Authorization", "Basic " + btoa(myClientId+":"+ mySecret));
},
success: function(data) {
alert("hi");
}
});
});
您这里可能遇到的是CORS
或Cross Origin Resource Sharing
的问题。它可以防止站点随意地发出请求。它的原因很复杂,但它能保证你的安全!虽然,这是一个很大的痛苦。
你可以在浏览器中获得JSON,因为那不是跨站请求。查看哪些头被来回发送,并查看在您的Udemy API门户中是否有方法为Allow-Origin
头设置可接受的Origin
。你的IP地址,如果你在本地工作。
可以这样编码:
var header = {"Authorization": "Basic " + btoa(username + ":" + password)};
为ajax调用添加标题,如下所示:
$.ajax({
url: "https://www.udemy.com/api-2.0/courses/",
type: 'GET',
dataType: "json",
contentType: "text/plain",
header,
success: function(data) {
alert("hi");
}
});
无论如何这对我有用。您还需要按照建议使用CORS
似乎您需要手动设置请求头与base64认证数据。
使用说明如下:http://coderseye.com/2007/how-to-do-http-basic-auth-in-ajax.html
首先需要从这里获取以下代码:http://www.webtoolkit.info/javascript-base64.html进行base64编码
/**
*
* Base64 encode / decode
* http://www.webtoolkit.info/
*
**/
var Base64 = {
// private property
_keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",
// public method for encoding
encode : function (input) {
var output = "";
var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
var i = 0;
input = Base64._utf8_encode(input);
while (i < input.length) {
chr1 = input.charCodeAt(i++);
chr2 = input.charCodeAt(i++);
chr3 = input.charCodeAt(i++);
enc1 = chr1 >> 2;
enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
enc4 = chr3 & 63;
if (isNaN(chr2)) {
enc3 = enc4 = 64;
} else if (isNaN(chr3)) {
enc4 = 64;
}
output = output +
this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +
this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);
}
return output;
},
// public method for decoding
decode : function (input) {
var output = "";
var chr1, chr2, chr3;
var enc1, enc2, enc3, enc4;
var i = 0;
input = input.replace(/[^A-Za-z0-9+/=]/g, "");
while (i < input.length) {
enc1 = this._keyStr.indexOf(input.charAt(i++));
enc2 = this._keyStr.indexOf(input.charAt(i++));
enc3 = this._keyStr.indexOf(input.charAt(i++));
enc4 = this._keyStr.indexOf(input.charAt(i++));
chr1 = (enc1 << 2) | (enc2 >> 4);
chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
chr3 = ((enc3 & 3) << 6) | enc4;
output = output + String.fromCharCode(chr1);
if (enc3 != 64) {
output = output + String.fromCharCode(chr2);
}
if (enc4 != 64) {
output = output + String.fromCharCode(chr3);
}
}
output = Base64._utf8_decode(output);
return output;
},
// private method for UTF-8 encoding
_utf8_encode : function (string) {
string = string.replace(/rn/g,"n");
var utftext = "";
for (var n = 0; n < string.length; n++) {
var c = string.charCodeAt(n);
if (c < 128) {
utftext += String.fromCharCode(c);
}
else if((c > 127) && (c < 2048)) {
utftext += String.fromCharCode((c >> 6) | 192);
utftext += String.fromCharCode((c & 63) | 128);
}
else {
utftext += String.fromCharCode((c >> 12) | 224);
utftext += String.fromCharCode(((c >> 6) & 63) | 128);
utftext += String.fromCharCode((c & 63) | 128);
}
}
return utftext;
},
// private method for UTF-8 decoding
_utf8_decode : function (utftext) {
var string = "";
var i = 0;
var c = c1 = c2 = 0;
while ( i < utftext.length ) {
c = utftext.charCodeAt(i);
if (c < 128) {
string += String.fromCharCode(c);
i++;
}
else if((c > 191) && (c < 224)) {
c2 = utftext.charCodeAt(i+1);
string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
i += 2;
}
else {
c2 = utftext.charCodeAt(i+1);
c3 = utftext.charCodeAt(i+2);
string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
i += 3;
}
}
return string;
}
}
然后,您将需要构建auth数据的代码,它只是base64的用户和密码:
function make_base_auth(user, password) {
var tok = user + ':' + password;
var hash = Base64.encode(tok);
return "Basic " + hash;
}
然后在发出请求之前用jQuery添加标题:
var service_url = "https://www.udemy.com/api-2.0/courses/"
$.ajax({
type: "GET",
url: service_url,
dataType: "xml",
data: "ParamId=" + FormId.value,
processData: false,
beforeSend : function(req) {
req.setRequestHeader('Authorization',
make_base_auth ('myClientId', 'mySecret'));
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
ajaxError(XMLHttpRequest, textStatus, errorThrown);
},
success: function(xml) { DoSomething(xml); }
});
Ajax通常使用相同的域。要实现跨域尝试使用CORS CORS URL