[英]Sending cross-domain ajax requests without jQuery
I have the following code: 我有以下代码:
function ajax(callback, requestString){
console.log("basic ajax sending");
var xmlhttp;
// compatible with IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
callback(xmlhttp.responseText); //we got a response
}
}
xmlhttp.open("GET", requestString, true);
xmlhttp.send();
}
//Here: code to be able to use that function repeatedly.
it works great if used on my node.js server's domain, problem is that I am developing an API, and requests have to be sent cross-domain. 如果在我的node.js服务器域上使用它很有用,问题是我正在开发一个API,并且请求必须跨域发送。 These requests(requestString) are just one string that is formatted something in the likes of: " http://example.com/r?a=a " + "&b= b" if that matters.
这些请求(requestString)只是一个字符串,格式如下:“ http://example.com/r?a=a ”+“&b = b”如果重要的话。 I get the following error: XMLHttpRequest cannot load.
我收到以下错误:XMLHttpRequest无法加载。 Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
交叉源请求仅支持协议方案:http,data,chrome,chrome-extension,https,chrome-extension-resource。 I did see a solution with jQuery and jsonP but I don't want to shove jQuery to my clients, so I have to find a good solution... Thank you for your time!
我确实看到了jQuery和jsonP的解决方案,但我不想把jQuery推给我的客户,所以我必须找到一个很好的解决方案......谢谢你的时间!
But jsonP can work without jQuery. 但是jsonP可以在没有jQuery的情况下工作。 For example:
例如:
var CallbackRegistry = {};
function scriptRequest(url, onSuccess, onError) {
var scriptOk = false;
// generating JSONP function name
var callbackName = 'cb' + String(Math.random()).slice(-6);
// add name in url
url += ~url.indexOf('?') ? '&' : '?';
url += 'callback=CallbackRegistry.' + callbackName;
CallbackRegistry[callbackName] = function (data) {
scriptOk = true;
delete CallbackRegistry[callbackName];
onSuccess(data);
};
function checkCallback() {
if (scriptOk) return;
delete CallbackRegistry[callbackName];
onError(url);
}
var script = document.createElement('script');
// for IE
script.onreadystatechange = function () {
if (this.readyState == 'complete' || this.readyState == 'loaded') {
this.onreadystatechange = null;
setTimeout(checkCallback, 0);
}
}
script.onload = script.onerror = checkCallback;
script.src = url;
document.head.appendChild(script);
}
Now you can get response through cross domain just call 现在您可以通过跨域调用获得响应
function afterSuccess(data) {
alert('Success' + data);
}
function afterError(data) {
alert('Error' + data);
}
scriptRequest(url, afterSuccess, afterError);
Well, on the server side you could change the Access-Control-Allow-Origin for the end point to Access-Control-Allow-Origin: *
, ...note this will match anything. 好吧,在服务器端,您可以将端点的Access-Control-Allow-Origin更改为
Access-Control-Allow-Origin: *
,...注意这将匹配任何内容。 Depending on your server framework there is definitely a method to whitelist certain urls to access your endpoint. 根据您的服务器框架,肯定有一种方法可以将某些网址列入白名单以访问您的端点。 Hope that helps
希望有所帮助
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.