vue项目打包部署到nginx服务器上出现了跨域问题,现在跨域问题通过配置nginx反向代理解决了,但是接口中报404错误,本地运行的时候没有任何问题
location /api {
proxy_pass https://gw.wozaixiaoyuan.com;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
location / {
# 配置您的Vue应用的根目录
root /www/wwwroot/guliblog.top;
try_files $uri $uri/ /index.html;
}
发一下你本地成功访问的路径,还有配置跨域后访问的路径
重要的一点,全程都要以root账户进行操作,输入su root ,然后输入密码即可进行root权限。
(1)Nginx结构目录:
(2)在这里我们要把前端打包好的代码dist下面的文件通过第三方软件上传到了index中了。
(3)这时候开始配置cong中的nginx.conf文件,vim nginx.conf。
(4)修改配置文件:具体如图所示,在这里注意proxy_pass http://之后的地址加你自己电脑的IP地址加上相应的后端的端口号。
举个例子:假设这里我本机的IP地址为192.168.12.1,SpringBoot的端口号为8081,那么请求地址为proxy_pass http://192.168.12.1:8081/;
如何查看本机的Ip地址呢?找到window10左下角输入cmd,然后输入ipconfig,就可以查看了。
(5)还有很重要的一点,要关闭Linux的防火墙,我这里是centos7.6,所以在命令行要输入systemctl stop firewalld.service。
到这里的话,把后端的项目跑起来,虚拟机上的Nginx运行起来,项目就可以正常访问了!!!