如何在JavaScript中使用JSONP请求执行Ajax调用?(复制)

时间:2022-10-07 16:40:55

This question already has an answer here:

这个问题已经有了答案:

I use pure JavaScript to make ajax call in another domain (cross-domain).

我使用纯JavaScript在另一个域(跨域)进行ajax调用。

So i need to specify the dataType. But i don't know, where to specify ?.

我需要指定数据类型。但我不知道,具体在哪里?

I use the following to make ajax call with javascript:

我使用下面的javascript进行ajax调用:

    var xmlhttp = new XMLHttpRequest();
    var url = 'www.mydomain.com/path/to/reach';

    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == XMLHttpRequest.DONE) {
            if (xmlhttp.status == 200) {
                console.log('Log : ' + url + ' || Updated.');
            }
            else if (xmlhttp.status == 400) {
                alert('There was an error 400');
            }
            else {
                alert('something else other than 200 was returned');
            }
        }
    };

    url = url + '?callback=my_callback_method';

    xmlhttp.open("GET", url, true);
    xmlhttp.send();

Also i make dummy callback,

我还做了虚拟回叫,

   function my_callback_method(res){
    //
   }

But, it won't work. I get error as Reason: CORS header ‘Access-Control-Allow-Origin’ missing.

但是,它不会工作。我得到错误的原因是:CORS header ' Access-Control-Allow-Origin '缺失。

What's wrong with my code ?

我的代码有什么问题?

Is it possible ?

是可能的吗?

Any Solutions ?

有解决方案吗?

(I need Solution for JavaScript Only !)

(我只需要JavaScript的解决方案!)

2 个解决方案

#1


1  

I get error as Reason: CORS header ‘Access-Control-Allow-Origin’ missing.

我得到错误的原因是:CORS header ' Access-Control-Allow-Origin '缺失。

This is because you're using XMLHttpRequest and usage of XMLHttpRequest requires CORS. The JSONP technique doesn't involve usage of XMLHttpRequest. The trick in JSONP is to create a script tag and let a browser load that script:

这是因为您正在使用XMLHttpRequest, XMLHttpRequest的使用需要CORS。JSONP技术不涉及XMLHttpRequest的使用。JSONP的诀窍是创建一个脚本标记,让浏览器加载该脚本:

var script = document.createElement('script');
script.src = '//domain.com/path/to/jsonp?callback=my_callback_method'

document.getElementsByTagName('head')[0].appendChild(script);

Also, you need to create a global function, in your case its my_callback_method, and call it from the jsonp script.

此外,您需要创建一个全局函数,在您的示例中是my_callback_method,并从jsonp脚本调用它。

Certainly, you server side should have implementation that when a request to //domain.com/path/to/jsonp is obtained, it should return a js document with a call to a global function specified in callback=my_callback_method:

当然,您的服务器端应该具有这样的实现:当获得对//domain.com/path/to/jsonp的请求时,它应该返回一个js文档,并调用callback=my_callback_method中指定的全局函数:

my_callback_method()

#2


1  

I finally stumbled upon this link "A CORS POST request works from plain javascript, but why not with jQuery?" that notes that jQuery adds the

我最终偶然发现了这个链接“一个CORS POST请求可以从普通的javascript中工作,但是为什么不使用jQuery呢?

 Access-Control-Request-Headers: x-requested-with

header to all CORS requests. jQuery 1.5.2 does not do this. Also, according to the same question, setting a server response header of

所有CORS请求的头。jQuery 1.5.2没有这样做。同样,根据同样的问题,设置一个服务器响应头。

Access-Control-Allow-Headers: *

does not allow the response to continue. You need to ensure the response header specifically includes the required headers. ie:

不允许响应继续。您需要确保响应标头特别包含所需的标头。即:

Access-Control-Allow-Headers: x-requested-with 

#1


1  

I get error as Reason: CORS header ‘Access-Control-Allow-Origin’ missing.

我得到错误的原因是:CORS header ' Access-Control-Allow-Origin '缺失。

This is because you're using XMLHttpRequest and usage of XMLHttpRequest requires CORS. The JSONP technique doesn't involve usage of XMLHttpRequest. The trick in JSONP is to create a script tag and let a browser load that script:

这是因为您正在使用XMLHttpRequest, XMLHttpRequest的使用需要CORS。JSONP技术不涉及XMLHttpRequest的使用。JSONP的诀窍是创建一个脚本标记,让浏览器加载该脚本:

var script = document.createElement('script');
script.src = '//domain.com/path/to/jsonp?callback=my_callback_method'

document.getElementsByTagName('head')[0].appendChild(script);

Also, you need to create a global function, in your case its my_callback_method, and call it from the jsonp script.

此外,您需要创建一个全局函数,在您的示例中是my_callback_method,并从jsonp脚本调用它。

Certainly, you server side should have implementation that when a request to //domain.com/path/to/jsonp is obtained, it should return a js document with a call to a global function specified in callback=my_callback_method:

当然,您的服务器端应该具有这样的实现:当获得对//domain.com/path/to/jsonp的请求时,它应该返回一个js文档,并调用callback=my_callback_method中指定的全局函数:

my_callback_method()

#2


1  

I finally stumbled upon this link "A CORS POST request works from plain javascript, but why not with jQuery?" that notes that jQuery adds the

我最终偶然发现了这个链接“一个CORS POST请求可以从普通的javascript中工作,但是为什么不使用jQuery呢?

 Access-Control-Request-Headers: x-requested-with

header to all CORS requests. jQuery 1.5.2 does not do this. Also, according to the same question, setting a server response header of

所有CORS请求的头。jQuery 1.5.2没有这样做。同样,根据同样的问题,设置一个服务器响应头。

Access-Control-Allow-Headers: *

does not allow the response to continue. You need to ensure the response header specifically includes the required headers. ie:

不允许响应继续。您需要确保响应标头特别包含所需的标头。即:

Access-Control-Allow-Headers: x-requested-with