• jquery jsonp请求错误处理,用原生js处理


    上面这个截图的代码,乍一看,没毛病,没写错。但是,它永远进不了error。

    为什么?

    我们仔细看看ajax方法的文档,在它error回调说明的最后有一句话:

    Note: This handler is not called for cross-domain script and cross-domain JSONP requests. This is an Ajax Event.

    这就说明在调用跨域的脚本及jsonp请求时,这个错误将不会被执行,并强调指出这个error是一个 Ajax Event.

     其实,严格而讲jsonp不是ajax,ajax是通过XMLHttpRequest对象发送异步请求,而jsonp则是利用js标签天生具备的跨域能力来实现跨域资源访问。也就是说,虽然它的名字叫JSONP(JSON with Padding),但它底层是通过js标签实现的,它跟json以及普通异步请求关系都不大,jquery之所以把jsonp请求放到ajax方法里面,只是为了让api更方便调用而已。 (JSONP的详细描述可以查看WIKI,或者google)

    那怎么做才能使JSONP的error回调被执行呢?

    我很久之前用原生js写了一个万金油的方法。

    也就是自己封装一个jsonp。jsonp封装原理,可点此查看。

    具体封装代码,在下面

     1 function getJsonp(url, params, callback,errorback) {
     2         //随机的名称,是考虑浏览器缓存。
     3         var name = "JSONP" + Math.random().toString().substring(2);
     4         var strUrl = url + "?callback=" + name;
     5         for(var key in params) {
     6             strUrl += "&" + key + "=" + params[key];
     7         }
     8         window[name] = function (data) {
     9             callback(data);
    10         }
    11         var script = document.createElement("script");
    12         script.onerror = function (err) {
    13             errorback && errorback(err)
    14         }
    15         script.src = strUrl;
    16         document.body.appendChild(script);
    17         document.body.removeChild(script);
    18     }
    19     
    20     //使用方法
    21     getJsonp("http://api.douban.com/v2/movie/in_theaters", {}, function(data){
    22         console.log(data);
    23     }, function(err){
    24         console.log("请求失败,失败原因:" + err)
    25     });
    26     getJsonp("http://api.douban.com/v2/movie/in_theaters", {start:0, count:1}, function(data){
    27         console.log(data);
    28     }, function(err){
    29         console.log("请求失败,失败原因:" + err)
    30     });
    View Code
  • 相关阅读:
    ubuntu12.04 安装配置jdk1.7
    Ubuntu下解决bash 没有那个文件或目录的方法
    Mongodb集群搭建的三种方式
    AngularJS 中文资料+工具+库+Demo 大搜集
    Android 反编译apk 详解
    Node.js 开发模式(设计模式)
    Comet:基于 HTTP 长连接的“服务器推”技术
    基于NodeJS的全栈式开发
    node.js应用Redis数据库
    Hibernate(二):MySQL server version for the right syntax to use near 'type=InnoDB' at line x
  • 原文地址:https://www.cnblogs.com/huoan/p/10315454.html
Copyright © 2020-2023  润新知