webpack之跨域

2024-10-19 14:29:53

前后端分离开发中，本地前端开发调用接口会有跨域问题，一般有以下几种解决方法：

直接启动服务端项目，再将项目中的资源url指向到前端服务中的静态资源地址，好处在于因为始终在服务端的环境中进行资源调试，不存在接口的跨域访问问题，但是缺陷也比较明显，需要同时启动两套环境，还需要借助nginx，charles等工具进行资源地址的代理转发，配置比较繁琐，对开发者对网络的理解和环境配置要求较高，资源开销也大；
CORS跨域：后端接口在返回的时候，在header中加入'Access-Control-Allow-origin':* 等配置，利用跨域资源共享实现跨域，前端部分只要求支持xhr2标准的浏览器，但是服务端在请求头中需要在header中做响应头配置，在一定程度上还是对服务端的接口设置有一定的依赖；
http-proxy：用nodejs搭建本地http服务器，并且判断访问接口URL时进行转发，由于利用了http-proxy代理的模式进行了转发，采用的是服务对服务的模式，能较为完美解决本地开发时候的跨域问题，也是本文中推荐的方式。

参考：

https://segmentfault.com/a/1190000009266900

最新文章

热门文章