欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

前后端分离开发部署的跨域问题

程序员文章站 2022-07-10 16:10:48
...

目前我自己知道的有3中方案

第一种:利用jsonp来解决跨域请求

    这种方式本质上是利用html标签的src属性去实现,但这种方式有一定的局限性。因为src加载资源是GET请求,一些POST请求无法实现,如上传文。当然上传文件也可以通过Base64编码转化成字符串,然后再拼接到URL上,但URL长度是有限制的,所以一些大文件是无法通过这种方式来解决


第二种:利用中间件(如nginx)进行代理转发

    如下图:

前后端分离开发部署的跨域问题

这样的话 对于浏览器来说,就是同一个域,也就不存在跨域的问题了。当然如果代理使用nginx的话,完全可以将静态资源直接发布至nginx。

    这种架构优势在于 

    1、开发的时候完全可以不考虑跨域的问题

    2、流量有统一的入口,可以统一进行的流量管理

    劣势在于 : 代理服务器流量压力较大


第三种:通过设置响应头信息,解决跨域问题:

//解决请求跨域 http://xxx.xxx:为前端服务器的域
response.setHeader("Access-Control-Allow-Origin", "http://xxx.xxx");
//解决session存储问题
response.setHeader("Access-Control-Allow-Credentials","true");

前台页面用ajax异步请求的时候 注意要加上 xhrFields:{withCredentials:true} 参数,因为异步请求时js对象发起请求,默认情况是不保存cookie的,加上这个参数,可以让浏览器保存cookie