有关JSONP和跨域

2018-09-08  本文已影响0人  小白不白Zcq

一、首先,简述一下JSON和JSONP二者的关系

JSON是一种轻量级的数据交换格式;
JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题

二、JSONP原理:

(1)核心原理:

所有具有src属性的HTML标签都可以是跨域的!

(2)具体解释:

1.首先在客户端注册一个回调函数如callback。
2.动态创建一个script标签,将其src值设置为请求地址同时添加参数与回调函数callback
3.服务器端对此get请求进行处理,并返回callback(data),data为服务端返回前端的数据
4.客户端接受到返回的js脚本,开始解析和执行callback

(3)JSONP的局限性:

需要server支持 支持GET请求

三、关于跨域:

1.引起跨域问题的是浏览器的同源策略它是一种为了解决浏览器安全问题的一种约定,所谓同源是指协议、域名、端口号三者相同,否则浏览器就报错。
2.跨域安全限制都是对浏览器端来说得,服务端是不存在跨域安全限制的。
3.具体什么是跨域,我们可以将其分为3点
<1>资源跳转:eg. A链接、重定向、表单提交。
<2>资源嵌入:<link>、<script>、<img>、<frame>、等dom标签,还有样式中background:url()、@font-face()等文件外链
<3>脚本请求: js发起的ajax请求、dom和js对象的跨域操作等

四、跨域的其他方法

1. 首先可以使用CORS,也就是跨域资源共享,它由Server来进行设置,客户端在正式通信前,会先发送一次“预检”请求,如果请求的域名在后台的许可名单之中,会返回一个肯定答复,浏览器就可以正式发送请求了。它有简单请求和非简单请求两种。
2. 还有可以通过nginx反向代理来进行跨域
3. 还可以开启谷歌浏览器的DeBug模式,在本地开发时进行跨域,这也是我在项目中最常用到的方式,因为公司的项目在正式上线后,都位于同一域名下,不会存在跨域问题的

以上就是我对于JSONP和跨域的了解,欢迎大家补充和修正。

上一篇 下一篇

猜你喜欢

热点阅读