【问题标题】:How to perform Ajax call with JSONP request in JavaScript? [duplicate]如何在 JavaScript 中使用 JSONP 请求执行 Ajax 调用? [复制]
【发布时间】:2017-05-13 11:16:09
【问题描述】:

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

所以我需要指定 dataType。但我不知道,在哪里指定?

我使用以下内容通过 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();

我也做了虚拟回调,

   function my_callback_method(res){
    //
   }

但是,它不会起作用。我收到错误 原因:CORS 标头“Access-Control-Allow-Origin”丢失

我的代码有什么问题?

有可能吗?

任何解决方案?

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

【问题讨论】:

    标签: javascript ajax


    【解决方案1】:

    我收到错误原因:CORS 标头“Access-Control-Allow-Origin” 不见了。

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

    var script = document.createElement('script');
    script.src = '//domain.com/path/to/jsonp?callback=my_callback_method'
    
    document.getElementsByTagName('head')[0].appendChild(script);
    

    此外,您需要创建一个全局函数,在您的情况下为 my_callback_method,并从 jsonp 脚本调用它。

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

    my_callback_method()
    

    【讨论】:

      猜你喜欢
      • 2014-07-05
      • 1970-01-01
      • 2011-09-22
      • 2012-07-29
      • 2013-10-27
      • 2016-07-22
      • 2011-08-19
      相关资源
      最近更新 更多