文档章节

完美解决javascript中jsonp跨域请求无法触发error 方法的触发的方案(兼容ie6+)

bosscheng
 bosscheng
发布于 2015/08/26 09:47
字数 238
阅读 81
收藏 0
  1. 对于ie6-ie8和oprea是不支持onerror事件的,对于不支持这个事件的可以用另外方式解决这个问题。

  2. jsonp回调函数总是在script的onload事件之前被调用的。利用这个机制可以解决问题1的问题。


代码实现

function getJSONByScript(url,jsonpCallName,charset,success,error){
    var script = document.createElement('script');
    var head = document.head || document.getElementsByTagName('head')[0] || document.documentElement;
    
    script.src = url;
    
    script.async = true;
    
    script.charest = charest;
    
    // 回调执行的方法。
    this[jsonpCallName] = function(data){
        //
        script.jsonp = 'loaded';
        success && success(data);
    }
    
    script.onload = script.onreadystatechange = function(){
        if(/onload|complete|undefined/.test(script.readyState) || (window.opera || -[1,])){
            if(typeof script.jsonp === 'undefined'){
                error && error();
            }
            
            if(script.clearAttributes){
                script.clearAtrributes();
            }
             script.onload = script.onreadystatechange = null;
             
             if(script.parentNode){
                 script.parentNode.removeChild(script);
             }
            
            script = null;
            
            delete window[jsonpCallName];
        }
    
    }
    
    // 高级浏览器支持的方法。
    script.onerror = function(){
        if(script.clearAttributes){
                script.clearAtrributes();
          }
          
         script.onerror = script.onload = script.onreadystatechange = null;
                     
          if(script.parentNode){
                script.parentNode.removeChild(script);
           }
            
          script = null;
          
          error && error();
        
        delete window[jsonpCallName];
    }
}


ps: 对于 jquery 是没有实现 jsonp 请求的error方法的,angular 是实现了这个方法的实现,

代码如下:


© 著作权归作者所有

bosscheng
粉丝 80
博文 303
码字总数 95443
作品 0
南京
前端工程师
私信 提问
javascript创建css、js,onload触发callback兼容主流浏览器的实现

由于需要写个函数,既可以加载css,又可以加载js,所以对各主流浏览器对加载js、css后是否触发onload事件做了个测试。当然,为了兼容,首先要考虑的是会用到onload和onreadystatechange,但他...

bosscheng
2015/10/26
3
0
用jQuery与JSONP轻松解决跨域访问的问题

跨域的安全限制都是指浏览器端来说的.服务器端是不存在跨域安全限制的,所以通过本机服务器端通过类似httpclient方式完成“跨域访问”的工作,然后在浏览器端用AJAX获取本机服务器端“跨域访问...

烽穹寒渊
2015/07/26
0
0
jsonp-反向代理-CORS解决JS跨域问题的个人总结(更新 v2.0)

网上说了很多很多,但是看完之后还是很混乱,所以我自己重新总结一下。 解决 js 跨域问题一共有8种方法: jsonp(只支持 get) 反向代理 CORS document.domain + iframe 跨域 window.name + ...

线上猛如虎_线下怂如鼠
2018/08/18
0
0
JS跨域请求(script标签)和JQuery跨域请求(jsonp)

前言: 为尽可能保证浏览器端安全,浏览器会遵循SOP协议,即同源协议 ajax无法完成跨域请求 $.get $.post $.ajax都不可以 jsonp作为ajax的一种扩展协议可以完成跨域请求 $.getJson()也可以完...

big_cat
2015/11/11
282
0
javascript跨域请求解决方法总结

javascript中有同源策略,javascript存在跨域通信的问题。典型例子如:Ajax无法直接请求跨域的普通文件,存在跨域无权限访问的问题。 几种常见的解决方法: 1.JSONP 2. window.name+frame 3...

wait106427
2015/08/18
366
0

没有更多内容

加载失败,请刷新页面

加载更多

好程序员web前端教程分享常见基础面试题之性能优化

  好程序员web前端教程分享常见基础面试题之性能优化,为了能够更快的通过企业面试,很多人都会背面试题,而性能优化是每一个企业都会问到的问题,今天就给大家分享一下。   性能优化(Op...

好程序员官网
30分钟前
5
0
面试题必问:spring MVC工作流程图

先看下我在网上找的一张图片,图虽然不是很好看但是很详细很清晰 具体解答 用户向服务器发送请求,请求被spring的核心组件DispatcherServlet截获 DispatcherServlet对请求URL进行解析,得到U...

shiliang_feng
31分钟前
6
0
centos7编译安装php7

安装依赖 [root@localhost ~]# yum -y install gcc gcc++ gcc-c++ wget make libxml2 libxml2-devel openssl openssl-devel curl-devel libjpeg-devel libpng-devel freetype-devel bison au......

请叫我足下
31分钟前
5
0
处理Unicode字符 \u202E 问题

这么一段字符串,实际内容应该是123abc456,在获取到的时候就变成下面的内容,肯定要处理呀.... 又得手撸了代码了\u202E : 会将字符串进行翻转,\u202D : 会将字符串互换位置,但为什么从...

小象鸭
36分钟前
4
0
怎么用视频转换器把qsv格式转换成mp4

随着生活水平不断提高消费水平也在不断的增长,与此同时娱乐已经成为了人们生活中重要的一环,在看一些视频时是否会发现例如qsv、qlv和kux等格式是不能用别的播放器打开的,其实这几个格式分...

cenfeng123
45分钟前
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部