jsonp封装
//jsonp的封装函数
function jsonp(url,parmter,callback){
//创建script标签
var script=document.createElement('script');
//拼接字符串
randomkey='cdf'+new Date().getTime();
//把拼接的字符串 变成全局变量 相当于callback函数的调用
window['randomkey']=callback;
//把数字拼接到 src中 callback
url='?callback'+randomkey;
if(parmter) {
for(var p in parmter ){
url +=("&"+p+"="+paemter[p])
}
}
script.src=url;
document.body.appendChild(script)
script.onload=function () {
document.body.removeChild(script)
}
}
//后台
var express=require('express')
var app=express();
app.get('/+访问的地址',function (req,res) {
var value=req.query['callback'];
var result=value+'数据 JSON.stringify转化成后台数据';
res.send(result)
)
app.get('*',function (req,res){
res.sendFile(__dirname+res.path)
})
app.listen(8888,function (){
console.log('服务器启动成功')
)
jsonp封装的更多相关文章
- 网络请求之jsonp封装
首先介绍下jsonp原理 浏览器因为同源策略的限制,在不同源的服务器通过我们传统axios是不能直接用来请求数据的(忽略代理),而src标签则不受同源策略的影响,所以我们需要动态的创建带有src的标签 ...
- jsonp封装成promise
首先将jsonp通过npm 安装引入js文件中,代码如下 import originJsonp from 'jsonp' export default function jsonp(url, data ...
- jsonp封装方法二
前言: 看到玉伯的聊聊jsonp的p,引发了另一种loader方式来跨域的方法,他把它叫做JSONM协议,原理和seajs相似,都是动态加载script,加载完成后执行callback, 同时还不用考 ...
- 2-8 js基础 jsonp封装
'use strict'; function jsonp(json){ json = json||{} if(!json.url)return; json.data=json.data||{}; js ...
- jsonp原理,封装,应用(vue项目)
jsonp原理 JSON是一种轻量级的数据传输格式. JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题.由于同源策略,一般来说位于 ...
- jsonp跨域封装
一.什么是同源政策? 同源策略是指在Web浏览器中,允许某个网页脚本访问另一个网页的数据,但前提是这两个网页必须有相同的URI.主机名和端口号,一旦两个网站满足上述条件,这两个网站就被认定为具有相同来 ...
- JSONP的诞生、原理及应用实例
问题: 页面中有一个按钮,点击之后会更新网页中的一个盒子的内容. Ajax可以很容易的满足这种无须刷新整个页面就可以实现数据变换的需求. 但是,Ajax有一个缺点,就是他不允许跨域请求资源. 如果我的 ...
- 深入理解JSONP原理——前端面试
JSON和JSONP虽然只有一个字之差,但是它们俩是八竿子打不着的:JSON是一种数据交换格式,JSONP是非正式的跨域数据交换协议. 为什么说JSONP是非正式的传输协议呢?因为它就是利用了< ...
- json和jsonp
JSON是一种数据交换格式! JSONP是一种依靠开发人员的聪明才智创造出的一种非官方跨域数据交互协议! 一般使用JSON来传数据,靠JSONP来跨域. JSON的优点: 1.基于纯文本, ...
随机推荐
- Hibernate 关联查询 相关错误
错误提示: could not resolve property: 确定有相关属性时,记得使用 criteria.createAlias @ManyToOne 若可能为null 要加上 @NotFou ...
- DotNet中的计时器线程计时器
转载自:http://hi.baidu.com/wingingbob/item/9f1c9615f3b24d5f2b3e225c 基于多线程设计,计时器工作在ThreadPool线程上,存在事件的重入 ...
- HTML5触摸屏touch事件使用介绍1
市面上手机种类繁多,在触屏手机上运行的网页跟传统PC网页相比还是有很大差别的.由于设备的不同浏览器的事件的设计也不同.传统PC站的 click 和 onmouseover 等事件在一般触屏的手机上也可 ...
- Shell中的${},##和%%的使用
假设我们定义了一个变量为: file=/dir1/dir2/dir3/my.file.txt 可以用${ }分别替换得到不同的值: ${file#*/}:删掉第一个/ 及其左边的字符串:dir1/di ...
- (六)Angularjs - 启动引导
自动引导 AngularJs 通过 ng-app 指令进行自动引导 手工引导启动框架 如果一个HTML文件中 有多个ng-app,AngularJS只会自动引导启动它找到的第一个ng-app应用,这是 ...
- Eclipse搭建struts2环境
搭建struts2环境 大的方面分为三步: 1. 加入jar包 2. 在web.xml中配置struts2 3. 添加struts2的配置文件struts.xml 下面是详细步骤: 1. 新建一个Dy ...
- 重装eclipse要做的事(二)---设置工作空间默认编码
在Eclipse的开发使用中,我们经常使用的是UTF-8,但是刚刚安装的或者是导入的项目是其他编码的默认是GBK的,这就造成我们的项目乱码,一些中文解析无法查看,对我们的开发造成不便. 我使用的是My ...
- Eclipse导入JavaWeb项目报错:The superclass "javax.servlet.http.HttpServlet" was not found on the Java Build Path
JavaWeb项目中写的JSP页面需要Web容器解析处理成HTML才能展示到前端浏览器,解析JSP需要Web容器.JSP页面顶端出现“红色”的报错信息:The superclass "jav ...
- python 安装中的错误解决
最近使用python3.5,其中遇到安装中的错误,现在记录下来,提个醒 1 安装setuptools 出现缺少 zlib模块 解决: 1 yum install zlib 2 yum install ...
- PHP浮点数的一个常见问题的解答
作者: Laruence 本文地址: http://www.laruence.com/2013/03/26/2884.html 转载请注明出处 关于PHP的浮点数, 我之前写过一篇文章: 关于PHP浮 ...