vue3+vite打包上线 nginx代理解决跨域

vue3+vite打包上线 nginx代理解决跨域

vue3 在项目开发阶段,面对跨域问题,是在vite.config.js中使用proxy代理解决的,vue项目打包后,使用nginx代理上线,发现post请求跨域,经查为vite.config.js中proxy失效导致,解决方法也简单,在nginx.conf中重新使用proxy即可,无需修改原代码

nginx.conf配置如下:

 listen       80;//端口,随便写,自定义
        server_name  xxxx;//本机ip地址 或者localhost即可
        #charset koi8-r;
        #access_log  logs/host.access.log  main;

        location / {
            root   E:\\vue3\\vue_common\\taxi_manager_vue3\\dist;//切记,windows中要用双斜杠,不然会报错,踩了一天坑
            index  index.html index.htm;
            try_files $uri $uri/ @router;
        }
        #proxy代理部分
          location  /api/ {	
		#rewrite    ^(.*)api(.*)$   $1/$2; break;
	proxy_pass http://10.xx.xx.220; # 代理接口地址,服务器api的地址,我的项目,220后面不能加/,不然post请求会报404,一般404就是nginx代理设置没有对
          }
          #nginx代理vue3,这块也是要有的,路由设置
         location @router {
        rewrite ^.*$ /index.html last;
         }
  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值