[聚合文章] 跨域总结-JSONP和XHR2

JSONP 2016-12-16 9 阅读

说明:通过node.js的express框架简易搭建,和跨域有关内容均已标出。

jsonp方式

1.服务器搭建:

文件jsonpcli.js:作为客户端服务器 jsonp.html:请求页

文件jsonpser.js:作为服务端服务器 process_get:响应页

运行这两个文件,客户端端口为8082,服务端端口为8081,跨域。

2.跨域请求

文件jsonp.html(三种方式任选一个) jsonp.html向process_get发出请求

在浏览器中输入网址:http://127.0.0.1:8082/jsonp.html

如图,请求成功!

PS:后台打印的响应数据:

方式一($.ajax):

方式二($.get):

方式三(script标签):

XHR2方式

文件jsonp.html和文件jsonpser.js,修改部分如下。

1.请求页ajax不用jsonp方式

2.响应页头信息中加了字段"Access-Control-Allow-Origin"

在浏览器中输入网址:http://127.0.0.1:8082/jsonp.html

如图,请求成功!

PS1:后台打印的响应数据

PS2:浏览器中查看HTTP头信息和响应数据

jsonp.html页

process_get页

注:本文内容来自互联网,旨在为开发者提供分享、交流的平台。如有涉及文章版权等事宜,请你联系站长进行处理。