模仿jsonp跨域请求

genefy 发布于2019-08-19 17:52 / 948人阅读

var jsonp = function() {
  var extend = function(obj, attrs) {
    for (var name in attrs) {
      obj[name] = attrs[name];
    }
  };
  var jsonp = function() {
    jsonp_imp.apply(null, arguments);
  };
  extend(jsonp, {
    guid: 0,
    requests: {},
    avail_tag: [],
    request_timeout: 5 //seconds
  });
  
  var Request = function(obj) {
    extend(this, obj);
    this.init && this.init();
  };
  var oo = Request.prototype;
  oo.remove = function() {
    var js = this.js;
    js.parentNode.removeChild(js);
    js = null;
    delete jsonp.requests[this.id];
  };
  oo.on_complete = function() {
    if (this.success) {
      this.success();
      this.success = null;
    }
  };
  oo.on_timeout = function() {
    var state = this.js.readyState;
    if (state != "complete" && state != "loaded" && this.failed) {
      this.failed();
      this.failed = null;
    }
    state = null;
    this.remove();
  };
  oo.init = function() {
    var request = this;
    this.js.onload = function() {
      request.on_complete();
    };
    setTimeout(function() {
      request.on_timeout();
    }, request.timeout);
  };
  
  var jsonp_imp = function(url, charset, timeout, failed, success) {
    var head = document.getElementsByTagName("head")[0];
    var js = document.createElement("script");
    head.appendChild(js);
    if (!charset) {
      charset = "utf-8";
    }
    var id = jsonp.guid++;
    if (!timeout) {
      timeout = jsonp.request_timeout * 1000;
    }
    var now = new Date();
    var request = new Request({
      id: id,
      url: url,
      charset: charset,
      failed: failed,
      success: success,
      js: js,
      stat_time: now,
      timeout: timeout
    });
    
    
    jsonp.requests[id] = request;
    js.charset = charset;
    js.src = url;
    return id;
  };
  return jsonp;
}();

var url = "http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.js";
var url2 = "http://saic-sis.escdn.com/api.php?op=get_linkage_xjw&parentid=10000000000004&act=ajax_getlist&keyid=1&callback=cb";
jsonp(url2 ,
  null, 
  5000,
  function(){alert("failed");},  
  function(){alert("load ok");}
);
function cb(d) {
  console.log(d);
}

海外云主机服务器托管 jsonp跨域请求 jsonp 跨域 jsonp 跨域乱码 ajax jsonp跨域传值

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/78927.html

跨域

摘要：一同源策略浏览器出于安全方面的考虑，只允许与本域下的接口交互。包括发送信息的内容，发送信息的域名等等同样的，在内添加一个事件监听绑定事件，在内通过方法发送信息给一样可以进行跨域通信一、同源策略(Same origin Policy) 浏览器出于安全方面的考虑，只允许与本域下的接口交互。不同源的客户端脚本在没有明确授权的情况下，不能读写对方的资源。 1、同源(本域) 所谓同源指的是三个...

keelii 2019-08-23 14:00 评论0 收藏0
跨域

摘要：代码第日前瞻中国冲击金博尔特再战米羽球正直播柴飚洪炜出战男双力争会师决赛女排将死磕巴西郎平安排男陪练模仿对方核心执行结果用，不跨域的打开发送请求时，请求头内部没有当我用打开，出现跨域时。一、同源策略浏览器出于安全方面的考虑，只允许与本域下的接口交互（当前页面得url必须和接口得url是同源的）。不同源的客户端脚本在没有明确授权的情况下，不能读写对方的资源。 1、本域同协议：如都是...

MageekChiu 2019-08-23 13:55 评论0 收藏0
JSONP原理

摘要：高级部分前后端联动浏览器服务器数据库是什么文件系统是一种数据库是一种数据库也是一个软件只要能长久地存数据，就是数据库前后端如何配合接下来我们用一个文件充当数据库实际上数据库的存储内容本质就是一个带有结构的文件捋一捋前后端交互的过程代码在这里 jsonp javascript高级部分:前后端联动,浏览器+服务器 1数据库是什么文件系统是一种数据库MySQL 是一种数据库,也是一个软件只...

testHs 2019-08-23 10:28 评论0 收藏0
前端部分知识总结

摘要：在中，每一个节点被称为回流重绘回流中部分全部元素的规模尺寸布局等改变而需要重新构建页面。而就是通过调用构造函数创建的对象实例的原型对象原型所指的就是一个对象，实例继承对象的属性。乱序不间断更新绝大多数写的比较浅显看个乐子 display:none 和visibility:hidden的区别 display:none彻底消失将会隐藏它以及所有的后代元素占据的空间消失，浏览器不会...

wuaiqiu 2019-08-02 16:13 评论0 收藏0
前端部分知识总结

摘要：在中，每一个节点被称为回流重绘回流中部分全部元素的规模尺寸布局等改变而需要重新构建页面。而就是通过调用构造函数创建的对象实例的原型对象原型所指的就是一个对象，实例继承对象的属性。乱序不间断更新绝大多数写的比较浅显看个乐子 display:none 和visibility:hidden的区别 display:none彻底消失将会隐藏它以及所有的后代元素占据的空间消失，浏览器不会...

Yujiaao 2019-08-23 17:04 评论0 收藏0