同源策略(百度百科):(Same origin policy)是一种约定,它是最核心浏览器也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。
同源:协议、域名、端口,都必须一致
违背同源就是跨域
解决方案:
1,设置响应头,允许跨域
response.setHeader('Access-Control-Allow-Origin','*')
这个需要在后端处理:
2,本地安装nginx,反向代理
下载nginx:nginx: download
在解压目录/conf/nginx.conf文件中进行配置
举个栗子:
(1)测试前端页面地址为:http://127.0.0.1:5500/code/17ajax/1-GET.html
(2)测试express服务:http://127.0.0.1:9000/server
nginx.conf文件配置如图,这样都反向代理到了http://127.0.0.1:8080下,这样就不存在跨域了
在浏览器中访问地址:http://127.0.0.1:8080,即可访问到测试前端页面
测试前端页面中ajax请求url为:http://127.0.0.1:8080/server
测试访问结果ok:
3,Node.js配合node-http-proxy
这个还没有试,我用的nginx
4,jsonp(GET请求)
理解:前端声明好一个函数,后端返回执行函数,执行函数参数中携带所需的数据