柚子讴歌的博客

思考跨域问题

2018/01/27

什么是跨域问题?

跨域就是指浏览器不能执行其他网站的脚本,这是由浏览器的同源策略造成的,是javascript的安全限制

一个域名地址是由:

http://(请求头) www(子域名) . cuijahuan(主域名) : 8080(端口号) / script/jquery.js(请求资源地址) 组成的

而同源,就是指域名,协议,端口均相同

当协议、子域名、主域名、端口号中任意一个不相同时,都算作不同域

而不同域之间的相互请求资源,就是跨域
比如http://cuijiahuan.xyz 请求 http://jiahuan.xyz

解决方法

1、使用ajax的JSONP

JSONP只支持GET请求,不支持POST请求

ajax请求受同源策略影响,不允许进行跨域请求,而script标签src属性可以访问跨域的js脚本,因此,服务器不再返回JSON格式的数据,而是返回一段调用某个函数的JS代码,在src中进行了调用,实现了跨域。

type:"get", // 接收服务器数据的类型
dataType:"jsonp", // 用于服务器端的获取函数的参数
jsonp:"callback", // 函数名称

2、使用cors解决跨域

cors跨域需要浏览器和后端进行支持,只要后端实现了cors,即实现了跨域

主要方法就是服务端设置Access-Control-Allow-Origin来开启cors,它表示允许哪些域名访问资源,如果设置的是通配符则表示所有网站都可以访问资源。

3、document.domain

该方法适用于两个url中的二级域名相同的情况,比如a.qq.comb.qq.com,遇到这种情况我们只需要给页面中添加document.domain = “qq.com”,通过它来实现跨域。

CATALOG
  1. 1. 什么是跨域问题?
  2. 2. 解决方法