腾讯云利用NGINX部署前后端项目出现403错误

最新推荐文章于 2024-04-21 13:44:12 发布

Damocles1

最新推荐文章于 2024-04-21 13:44:12 发布

阅读量1.1k

点赞数

分类专栏： BUG 文章标签： nginx java vue intellij idea

本文链接：https://blog.csdn.net/weixin_42792824/article/details/115270773

版权

BUG 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

一，常见的问题

二，解决方法

三，结语

一，常见的问题

403错误一般是权限不够，但是我按照网上其他教程修改成777，或者添加user root仍然报错，error.log日志中会出现以下以下警告

我自己的问题是由于nginx进程开得太多，在windows系统下，每次修改nginx.conf文件时都是直接点击nginx.exe，我前端项目就放在nginx的html文件夹下，网上有个新建app文件夹，然后把静态资源放进去，我也试了，根本不行，看到某一篇博客写的是用命令行的方式去刷新nginx服务，windows10下结束关于nginx的代码如下

taskkill /f /im nginx.exe #结束所有有关nginx进程
start nginx.exe #启动nginx服务

在linux系统下类似，命令差不多。

二，解决方法

原本打算做一个利用nginx部署到云服务器上的demo，因此就写了个简单的登录请求，前端用post请求，最开始直接部署上去发现nginx无法代理到后端提供服务的端口，在linux下我不断使用

./nginx -s reload

来刷新nginx的服务，然后疯狂出错，我就简化了下，现在本地部署nginx，代理本地的访问请求，本地提供后端服务，前端我用vue框架，最开始连转发端口都没有明白，前端的端口和后端的端口，以及nginx代理的端口之间的关系，在nginx里配置端口的时候一直出错，因为前端项目我一直在本地运行，访问请求也是用的proxy代理，后来发现用nginx就不需要前端写访问后端的ip地址，只需发送访问请求，请求后端就由nginx来做，本地的项目配置如下

前端

后端

nginx配置


#user root;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       mime.types;
    default_type  application/octet-stream;

    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

	#设定通过nginx上传文件的大小
    client_max_body_size 300m;
	
    #keepalive_timeout  0;
    keepalive_timeout  65;

    server {
		autoindex on;
        listen       8099;
        server_name  localhost;
		
	add_header Access-Control-Allow-Origin *;
	add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
	add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';

        #charset koi8-r;
    }
		
    #配置节点1
    location / {
        #存放静态资源的地方，也可以放在默认目录nginx的html下 就不用写路径
	root D:\Study\vue\wendao_vue\dist;
	index  index.html index.html;		
	#单页面应用解决重定向问题
        try_files $uri $uri/ /api$uri?$args;
    }		
    location /api {
	proxy_set_header    X-Forwarded-Host    $host;
	proxy_set_header    X-Forwarded-For     $proxy_add_x_forwarded_for
	proxy_pass http://127.0.0.1:8011/liu;	
    }
   }
}

前端login请求是http://127.0.0.1:8099/api/XXX，这里的端口号就是nginx监听的端口号，然后根据端口号后面的字符串进行匹配，在location .^/?{.....}里先找到location /api{}模块。这里我写了代理地址是http://127.0.0.1:8011/liu,说明前端请求到这里就会变成http://127.0.0.1:8011/liu/login，在浏览器查看访问请求时是http://127.0.0.1:8099/api/login,实际上真正的请求是http://127.0.0.1:8011/liu/login,这就完成了跨域请求，并不用后端配置@CrossOrigin注解，并实现WebMvcConfigure接口。

三，结语

总体来说，这次利用nginx部署前端后端到云服务器上，花了我整整两天的时间才解决，解决办法就是nginx线程太多，自己并没有这方面的考虑，只是照着别人的方法修改，一个方法一个方法去试，网上方法千千万，总有一种能解决自己的问题，就是比较费时间，不过直接对nginx的配置有了更多的理解，官方文档还是比较好的参考资料。

你好，欢迎读到此处，有什么想法或者见解，欢迎道友私信，我是非酋的咸鱼乀，一个不擅长写代码的却十分热衷于做梦的人。