美文网首页
关于 jsonp 的错误

关于 jsonp 的错误

作者: HeyDelilah | 来源:发表于2016-08-24 10:25 被阅读0次

背景:
使用原生 javascript ,写 jsonp 的可跨域请求逻辑,不间断发送心跳。

大失误:
由于心跳包是每秒发送一个 jsonp ,结果导致了头部插入了数不清的 script 标签。

需要做的:

  1. 清除标签
  2. 涉及的相应内存占用也要清除掉 ( 如何判断哪些是需要删除的?)

方案一:
设置唯一 id,以保证每次仅有一个 script 标签;
新增 timestamp , 以更新 url ;
结果:没用, 似乎必须要 “新增标签”,<script> 标签的 src 属性才会发起对起url的远程请求

需要做的:

  1. 了解浏览器解析标签的本质,<script> 标签中的 src 属性是如何加载资源的?
  2. 看看 jquery 是怎么处理 jsonp 的?
  3. 若这个 jsonp 请求返回的是 404 怎么办?

方案二:
每次都新增标签,但在 onload 时候,清除标签,代码如下:

var script = document.createElement('script');
var url = 'xxx';
script.setAttribute('src', url);
document.head.appendChild(script);
script.onload = function(ev){
var target = ev.target;
target.parentNode.removeChild(target);
}

相关文章

  • 关于 jsonp 的错误

    背景:使用原生 javascript ,写 jsonp 的可跨域请求逻辑,不间断发送心跳。 大失误:由于心跳包是每...

  • 前端 JSONP 原理及 Node 模拟 JSONP

    1、关于 JSONP 请求的注意项 a、JSONP 请求只支持 GET 形式 b、JSONP 请求返回的是一个自定...

  • JSONP的劫持

    关于 JSONP JSONP 全称是 JSON with Padding ,是基于 JSON 格式的为解决跨域请求...

  • 关于jsonp劫持

    关于jsonp JSONP 全称是 JSON with Padding ,是基于 JSON 格式的为解决跨域请求资...

  • jsonp原理

    什么是JSONP? 先说说JSONP是怎么产生的: 其实网上关于JSONP的讲解有很多,但却千篇一律,而且云里雾里...

  • 关于JSONP

    用 img 发送请求 只能用 get 方法,只能以图片的形式展示 后台 用 script 方法请求 script ...

  • 关于JSONP技术

    0,什么是数据库?文件系统是数据库,MYSQL是数据库,MYSQL是一个软件,用来做数据库。 1.先简单了解一下后...

  • jsonp原理详解

    什么是JSONP? 其实网上关于JSONP的讲解有很多,但却千篇一律,而且云里雾里,对于很多刚接触的人来讲理解起来...

  • JSONP、JQuery发送AJAX、JSONP请求

    1.JSONP 2.JQuery发送AJAX、JSONP请求 1.JSONP JSONP利用JavaScript...

  • JS-18day

    1、jsonp公开接口 2、jQuery-jsonp 3、jsonp

网友评论

      本文标题:关于 jsonp 的错误

      本文链接:https://www.haomeiwen.com/subject/wuonsttx.html