海滨擎蟹

若依前后端分离版部署出现 404 以及接口访问 404 问题

使用若依前后端分离版本开发一个新项目,在部署的时候出现 404 报错:

项目的 nginx 配置是从之前一个项目复制过来的,也是前后端分离,然后通过 nginx 做的反向代理。

server {
    listen              90;
    server_name         localhost;
    access_log          /xx/nginx/gpsmanage.log main;

    location / {
        root   /xx/nginx/html/web/gpsmanage-h5;
        index  index.html index.htm;
    }

    location /prod-api/ {
        client_body_buffer_size 256k;
        proxy_redirect off;
        proxy_set_header Host $http_host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_connect_timeout 30;
        proxy_send_timeout 30;
        proxy_read_timeout 60;
        proxy_buffer_size 256k;
        proxy_buffers 4 256k;
        proxy_busy_buffers_size 256k;
        proxy_temp_file_write_size 256k;
        proxy_next_upstream error timeout invalid_header http_500 http_503 http_404;

        proxy_pass http://localhost:9000;
    }
}

404 报错太普遍了,也处理过很多次,但都不记得了。

百度了一下,是要在根目录添加 try_fiels 语句,实现伪静态。实际访问的是路径是不包含 .html 后缀的,但 nginx 解析的文件就是 index.htmlindex.htm(文件类型索引:index index.html index.htm;),所以需要做一下转换。

server {
    listen              90;
    server_name         localhost;
    access_log          /xx/nginx/gpsmanage.log main;

    location / {
        root   /xx/nginx/html/web/gpsmanage-h5;
        try_files $uri $uri/ /index.html;
        index  index.html index.htm;
    }

    location /prod-api/ {
        client_body_buffer_size 256k;
        proxy_redirect off;
        proxy_set_header Host $http_host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_connect_timeout 30;
        proxy_send_timeout 30;
        proxy_read_timeout 60;
        proxy_buffer_size 256k;
        proxy_buffers 4 256k;
        proxy_busy_buffers_size 256k;
        proxy_temp_file_write_size 256k;
        proxy_next_upstream error timeout invalid_header http_500 http_503 http_404;

        proxy_pass http://localhost:9000;
    }
}

想起来当初做 php 项目部署的时候也是经常会遇到 404,就是这么处理的。

此时登录页出来的,但又出现新的报错:登录状态已过期,您可以继续留在该页面,或者重新登录:

验证码也没有加载出来,提示 401 认证失败,无法访问系统资源

点击重新登录请求一直无法完成,查看请求状态也是 401。也就是说,此时所有的后台请求都是 401。

但我查看 ip+port 后面默认地址是有信息的,knife4j 接口文档也访问正常。

找了很久没有确认问题所在,就去找官方文档里的部署部分 - nginx 配置,对照着查看,果然发现了问题。

代理配置中,proxy_pass http://localhost:9000; 后面少了一个斜杠,应该为 proxy_pass http://localhost:9000/;

简单的问题出错了就是这么让人摸不着头脑。这里应该是代理路径转化的问题,如果没有斜杠 /,那么 http://localhost:90/prod-api/logout 访问的就是 http://localhost:9000logout,压根找不到地址。

添加斜杠 / 之后,重启 nginx 访问成功。

server {
    listen              90;
    server_name         localhost;
    access_log          /xx/nginx/gpsmanage.log main;

    location / {
        root   /xx/nginx/html/web/gpsmanage-h5;
        try_files $uri $uri/ /index.html;
        index  index.html index.htm;
    }

    location /prod-api/ {
        client_body_buffer_size 256k;
        proxy_redirect off;
        proxy_set_header Host $http_host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_connect_timeout 30;
        proxy_send_timeout 30;
        proxy_read_timeout 60;
        proxy_buffer_size 256k;
        proxy_buffers 4 256k;
        proxy_busy_buffers_size 256k;
        proxy_temp_file_write_size 256k;
        proxy_next_upstream error timeout invalid_header http_500 http_503 http_404;

        proxy_pass http://localhost:9000/;
    }
}

当前页面是本站的「Google AMP」版。查看和发表评论请点击:完整版 »