电商网站建设论文参考文献,织梦网站一排4张图片,wordpress title背景,给别人做网站的销售叫什么软件JSONP
JSONP是什么 JSONP(JSON With Padding),是一个非官方的跨域解决方案#xff0c;纯粹凭借程序员的聪明才智开发出来的#xff0c;只支持get请求。JSONP 怎么工作的#xff1f; 在网页有一些标签天生具有跨域能力#xff0c;比如#xff1a;img link iframe script. …JSONP
JSONP是什么 JSONP(JSON With Padding),是一个非官方的跨域解决方案纯粹凭借程序员的聪明才智开发出来的只支持get请求。JSONP 怎么工作的 在网页有一些标签天生具有跨域能力比如img link iframe script. JSONP就是利用Script标签的跨域能力来发送请求的JSONP的使用 动态的创建一个script标签 var scriptdocument.createElement(“script”);设置script 的src,设置回调函数
script.src http://localhost:3000/testAJAX?callbackabc;
function abc(data) {
alert(data.name);
}3. 将script 添加到body中document.body.appendChild(script)4.服务器中路由的处理router.get(/testAJAX , function (req , res) {
console.log(收到请求);
var callback req.query.callback;
var obj {
name:孙悟空, age:18
}
res.send(callback(JSON.stringify(obj)));
});案例分析
html
!DOCTYPE html
html langenheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title原理演示/titlestyle#result {width: 300px;height: 100px;border: solid 1px #78a;}/style
/headbodydiv idresult/divscript//处理数据function handle(data) {//获取 result 元素const result document.getElementById(result);result.innerHTML data.name;}/script!-- script srchttp://127.0.0.1:5500/%E8%AF%BE%E5%A0%82/%E4%BB%A3%E7%A0%81/7-%E8%B7%A8%E5%9F%9F/2-JSONP/js/app.js/script --script srchttp://127.0.0.1:8000/jsonp-server/script
/body/htmlserver:
//jsonp服务
app.all(/jsonp-server,(request, response) {// response.send(console.log(hello jsonp));const data {name: 德仔dezai};//将数据转化为字符串let str JSON.stringify(data);//返回结果response.end(handle(${str}));});
