原生js实现jsonp
有时候用js封装个小工具需要一些已经被封装好的函数,比如jq的jsonp
但是原生小工具如果仅仅为了这个就导入一个上百kb的jQuery不划算
然后我去网上找,一大堆废文,还是自己发一篇记录一下吧
下面是 jsonp 在 js 中的实现方法
/**
* 模拟实现jsonp
* @param {Object} url
* @param {Object} callback
*/
function jsonp(url, callback) {
var callbackName = 'jsonp_callback_' + (new Date().getTime());
window[callbackName] = function(data) {
delete window[callbackName];
document.body.removeChild(script);
callback(data);
}; var script = document.createElement('script');
script.src = url + (url.indexOf('?') >= 0 ? '&' : '?') + 'callback=' + callbackName;
document.body.appendChild(script);
}
原生js实现jsonp的更多相关文章
- 基于原生JS的jsonp方法的实现
基于原生JS的jsonp方法的实现 jsonp,相信大家并不陌生,是在js异步请求中解决跨域的方法之一,原理很简单,有不清楚的同学可以google下,这里就补详细解释了.在Jquery库中,jQuer ...
- 用原生js来处理跨域的数据(jsonp)
说明总结: 1.ajax和jsonp其实本质上是不同的东西.ajax的核心是通过XmlHttpRequest获取非本页内容,而jsonp的核心则是动态添加<script>标签来调用服务器提 ...
- 前端跨域问题相关知识详解(原生js和jquery两种方法实现jsonp跨域)
1.同源策略 同源策略(Same origin policy),它是由Netscape提出的一个著名的安全策略.同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正 ...
- 原生js实现简单JSONP
JSONP是一种非常常见的实现跨域请求的方法.其基本思想是利用浏览器中可以跨域请求外链的JS文件,利用这一特性实现数据传输. 用原生JS实现JSONP非常简单,无非几点: 1)定义一个函数,用于处理接 ...
- 原生JS封装Ajax插件(同域&&jsonp跨域)
抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...
- Ajax进阶之原生js与跨域jsonp
什么是Ajax? 两个数求和: 用Jquery和数据用json格式 viws函数: from django.shortcuts import render,HttpResponse # Create ...
- 用原生js实现ajax、jsonp
转载: http://www.cnblogs.com/yangheng/p/6065910.html 一.原生js实现ajax $.ajax({ url: '', type: 'post', data ...
- 原生JS和jQuery分别使用jsonp来获取“当前天气信息”
需掌握的技能点: jsonp.跨域相关等. 以下两种代码,均可直接运行. 1.使用原生JS: <!DOCTYPE html> <html lang="en"> ...
- 用原生JS实现AJAX和JSONP
前端开发在需要与后端进行数据交互时,为了方便快捷,都会选择JQuery中封装的AJAX方法,但是有些时候,我们只需要JQuery的AJAX请求方法,而其他的功能用到的很少,这显然是没必要的.其实,原生 ...
- AJAX请求和跨域请求详解(原生JS、Jquery)
一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数 ...
随机推荐
- RE语法
RE,英文为Regular Expression,中文译作正则表达式.用于文本过滤的工具.RE语法由一些元字符.其它任意字符串作为基本单元,匹配次数.分组匹配.锚定符等为操作单元组成.进行逐行扫描,满 ...
- java.lang.ClassNotFoundException: org.springframework.web.filter.CharacterEncodingFilter 增样将jar包导入
2021-9-30-17:28 遇到的一个bug.以前遇到过,这次又遇到.就离谱,结果还忘记怎样解决了.这捣鼓一下,那捣鼓一下,又给搞好了.为了记录这次bug,又试图还原bug. 1.解决办法file ...
- 知识图谱顶会论文(KDD-2022) kgTransformer:复杂逻辑查询的预训练知识图谱Transformer
论文标题:Mask and Reason: Pre-Training Knowledge Graph Transformers for Complex Logical Queries 论文地址: ht ...
- OpenStack云计算平台框架
概: OpenStack是包含很多独立组件的一个云计算平台框架.在安装组件前,需要先将框架搭建出来,才能向其中放置组件. 搭建open stack云计算平台框架 一.安装open stack云计算平 ...
- element-ui el-table 多选和行内选中
<template> <div style="width: 100%;height: 100%;padding-right: 10px"> <el-t ...
- ARM TrustZone白皮书部分阅读
嵌入式系统安全的一些解决方法及缺陷 外部硬件安全模块:在主SoC之外包含一个专用的硬件安全模块或可信元件,e.g. 手机的SIM卡.隔离仅限于可以从非易失性存储器运行的相对静态程序 内部硬件安全模块: ...
- Linux环境jdk安装配置
1.jdk安装包:jdk-8u191-linux-x64.tar.gz2.拷贝 jdk-8u191-linux-x64.tar.gz 到/usr/local命令如下:cp jdk-8u191-linu ...
- 解决Halcon转C#时,图像显示的问题
不知道大家在使用Halcon进行图像处理,由于要连续处理多张图片,转为C#代码的时候,使用了Halcon控件显示图像,但是运行的时候,中间的其他图片没有显示在控件上,之前我一直以为是运行速度快导致看不 ...
- 【RPC和Protobuf】之Protobuf环境配置及组合工作
Protobuf定义:是一种数据描述语言,作为接口规范的描述语言,可作为设计安全的跨语言RPC接口的基础工具 一.Protobuf入门 作用:最终保证RPC接口规范和安全 最基本的数据单元:messa ...
- Atcoder补题计划
11.17 AtCoder Regular Contest 151 知识点: A:简单题 B:计数,并查集 补题传送门