一、同源策略
在我们开始阐述跨域请求之前我们需要弄清楚什么是同源策略?因为跨域请求就是为了解决同源策略的问题。好了我们开始正题吧!
首先我们需要知道同源这个概念:同源指的是一个请求路径中的请求协议、ip及端口和另一个请求路径中的请求协议、ip及端口保持一致。同源策略是指:它是由Netscape提出的一个著名的安全策略。现在所有支持JavaScript 的浏览器都会使用这个策略。举个例子:我们在浏览器中打开一个网页,当我们点击页面某个连接执行一个脚本的时候会检查这个脚本是属于哪个页面的,即检查是否同源,只有和当前页面同源的脚本才会被执行。如果非同源,那么在请求数据时,浏览器会在控制台中报一个异常,提示拒绝访问。
如下一个实例,我们建立一个django项目:
页面ajax请求代码:
$.ajax({
url:"/send_ajax/",//当前项目中视图函数
success:function(data) {
alert(data)
}
})
})
视图函数send_ajax:
defsend_ajax(request):return HttpResponse("这是项目1 ajax返回")
此种为正常情况,同过页面的点击按钮发送ajax请求,请求的路径为当前项目下的某个视图函数,此种显然符合同源策略。但是当我们把上述的ajax请求路径更改为另一个项目某个视图函数的路径,如:url:"http://127.0.0.1:8002/send_ajax/",此两个项目的端口不同。此时再发送ajax请求时,浏览器端会报如下错误:
已拦截跨源请求:同源策略禁止读取位于 http://127.0.0.1:8002/send_ajax/ 的远程资源。(原因:CORS 头缺少 'Access-Control-Allow-Origin')。
注意,上述这种错误是由于浏览器的同源策略给我们抛出的,实际上是请求到了对应的视图函数,只是浏览器不会把这种非同源请求返回的数据给我们。
二、跨域请求
如何解决上述的问题?