徐州建设安全监督网站,怎样做分销网站,188旅游网站管理系统源码,汕头市网站建设分站公司前言
本文主要讲解跨域问题以及解决跨域问题的方案之一JSONP的实现方式。
什么是跨域
全称为Cross-Origin Resource Sharing,简单来说请求的客户端和服务端的端口、域名、协议中的任意一个有不一样的地方在URL的展示中#xff0c;那么就会出现这个跨域问题。
它产生的原因…前言
本文主要讲解跨域问题以及解决跨域问题的方案之一JSONP的实现方式。
什么是跨域
全称为Cross-Origin Resource Sharing,简单来说请求的客户端和服务端的端口、域名、协议中的任意一个有不一样的地方在URL的展示中那么就会出现这个跨域问题。
它产生的原因是因为浏览器实现了一种同源策略同源策略是为了保护信息安全而设立的安全机制它限制了一个源从另一个源获取或发送数据资源进行交互操作为了防止恶意网站窃取用户信息。
JSONP
JSONP它是一种解决跨域的协议它是利用script标签没有跨域限制的特性通过在服务器上注册一个函数同时在本地中调用这个全局函数并且将这个数据作为参数再传递回服务器就实现了一个跨域的效果。
JSONP解决跨域具体流程
js创建script标签let scriptdocument.createElement(script)全局挂载一个window.jsonp方法把这个标签添加到body标签的尾部document.body.append(script)在服务端中先从请求url中解析出参数然后进行业务处理然后把返回数据返回。返回时需要设置请求头为text/javaScript服务端返回一段字符串在前端接收到的是一个可执行的js代码 比如 前端/客户端定义一个函数
handle(data){
console.log(data)
}前端发送GET请求到服务器
let scriptdocument.createElement(script)
script.srchttp://xxx.com/data?callbackhandle
document.body.appendChild(script)后端/服务器接收到请求后把返回数据拼接成字符串
handle({name:123})注JSONP只支持GET请求不支持POST请求。JSONP容易受到XSS攻击。所以一般跨域问题都是通过服务器端解决。