标签：字符串 支持 server 安全 端口 ali 请求 class cal
1 由于浏览器的安全性(同源策略)限制，不允许AJAX访问协议不同或域名不同或端口号不同的数据接口；
2 可以通过动态创建script标签的方式，把script标签的src属性指向数据接口的地址，因为script标签不存在跨域限制，这种数据获取方式称为jsonp[由原理可知其只支持get请求]；
3 具体实现过程：
a、先在客户端定义一个回调函数，预定义对数据的操作； //客户端定义回调函数名传给服务器，这样服务器端返回数据的方法名不用写死，客户端灵活设置而服务端不用变化。
b、再把这个回调方法的名称通过URL传参的形式提交到服务器的数据接口；
c、服务器数据接口组织好要发送给客户的数据，再拿着客户端传递过来的回调方法名称，拼接出一个调用这个方法的字符串，发送给客户端去解析；
d、客户端拿到服务器返回的字符串之后，添加到script脚本去解析执行，这样就能够拿到jsonp的数据了；
例如：//下面结合node搭建个服务器实现jsonp
客户端：<script> function show(data){ console.log(data)}</script> <script src="http://127.0.0.1:3000/getscript?callback=show"></script> 服务器端：const http = require(‘http‘) //导入http内置模块 const urlModule = require(‘url‘) //这个核心模块能解析URL地址拿到pathname query等 const server = http.createServer() //创建一个http服务器 server.on(‘request‘,function(req,res){ //监听http服务器的request请求 const { pathname: url,query} = urlModule.parse(req.url,true) //node的结构赋值 if (url ===‘getscript‘){ var data = { id:‘1‘, name: ‘宝马‘, createtime: new Date()} var scriptStr = `${query.callback}(${JSON.stringify(data)})` //拼接一个合法的JS脚本，这里拼接的是一个方法的调用 res.end(scriptStr) //res.end把这个字符串发送给客户端，客户端当做JS代码去解析执行 }else{ res.end(‘404‘) } })
标签：字符串 支持 server 安全 端口 ali 请求 class cal
原文地址：https://www.cnblogs.com/mengzhongfeixue/p/11839396.html
