nginx配置vue项目刷新访问404问题

nginx配置vue项目刷新访问404问题

常见问题有:

1、部署后,打开地址可以看到,但是刷新后出现404。 2、Vue的路由资源并不必定是真实路径,导致页面无法跳转或其他资源加载问题。 3、请求后端接口地址失败。

server {
        listen       8080;
        server_name  localhost;

        #charset koi8-r;
        #access_log  logs/host.access.log  main;

        location / {
            # 项目地址
            root   D:projectvuevue_general_management_systemproject-v2dist;
            index  index.html index.htm;
            
             # 解决vue项目刷新后来变成404的问题
            try_files $uri $uri/ @router;
        }
        
        location @router {
            # Vue项目路由不是真实存在的,所以需要将请求重写到 index.html 中,然后交给真正的 Vue 路由处理请求资源
            rewrite ^.*$ /index.html last; 
        }
        
        # 请求后端失败
        location /api/ {
          # 后端的真实接口
          proxy_pass http://1.116.64.64:5004/api2/;
          proxy_redirect off;
          proxy_set_header Host $host;
          proxy_set_header X-Real-IP $remote_addr;
          proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
          proxy_set_header   Cookie $http_cookie;
          # for Ajax
          #fastcgi_param HTTP_X_REQUESTED_WITH $http_x_requested_with;
          proxy_set_header HTTP-X-REQUESTED-WITH $http_x_requested_with;
          proxy_set_header HTTP_X_REQUESTED_WITH $http_x_requested_with;
          proxy_set_header x-requested-with $http_x_requested_with;
          client_max_body_size 10m;
          client_body_buffer_size 128k;
          proxy_connect_timeout 90;
          proxy_send_timeout 90;
          proxy_read_timeout 90;
          proxy_buffer_size 128k;
          proxy_buffers 32 32k;
          proxy_busy_buffers_size 128k;
          proxy_temp_file_write_size 128k;
        }

   

© 版权声明
THE END
如果内容对您有所帮助,就支持一下吧!
点赞0 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容