自从出了Cookie的sameSite属性,本地开发跨域联调就很费劲了,为了解决这个问题,我们可以再本地跑一个nginx服务,然后做反向代理,这样就没有跨域了!
当然,webpack有自带的跨域机制webpack.devServer,有兴趣的可以去查阅下相关资料
一、非框架开发时,配置本地nginx反向代理:
先去下载nginx包,然后解压,找到conf文件夹,里边有nginx.conf文件,打开,并修改server配置如下:
server {
listen 8088;// 前端访问端口
server_name 127.0.0.1;//这块可以自己配置,可以是域名(修改本地host文件)
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root html;
index exam-list.html exam-list.htm;
}
# 反向代理: /test/是接口公用路径(后端配置)
location /test/ {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_set_header X-Nginx-Proxy true;
proxy_set_header Connection "";
proxy_pass http://*.*.*.*:9999; #****这里填上服务器地址和端口
proxy_redirect default ;
}
#error_page 404 /404.html;
# redirect server error pages to the static page /50x.html
#
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
ok,nginx反向代理配置完成!
本文暂时没有评论,来添加一个吧(●'◡'●)