zoukankan      html  css  js  c++  java
  • 关于nginx部署vue项目的两个问题

    首先我使用的是后端接口+前端vue的形式,这样就涉及到跨域的问题。我是这样配置的:

    server {
            listen       80;
            server_name  www.liangyp.xyz;//访问网址
    
            location / {
                    root  /var/www/VueApp;
                    index  index.html index.htm;
            }
                    //这里是配置的如果访问apis则是转到后端接口,这样就避免了跨域
                    location /apis {
                            rewrite  ^/apis/(.*)$ /$1 break;
                            proxy_pass   http://127.0.0.1:3000/;
           }
    }

    然后还遇到一个问题:我在vue中使用的是vue-router跳转的,如果跳到二级菜单,刷新页面的话会出现404页面。这是因为在vue中使用的是js渲染的虚拟目录,而在nginx配置中并没有实际的资源,所有会出现404。直接上配置:

    server {
            listen       80;
            server_name  www.liangyp.xyz;
    
            location / {
                    root  /var/www/VueApp;
                    index  index.html index.htm;
                    try_files $uri $uri/ @router;
            }
            location @router {
                rewrite ^.*$ /index.html last;
            }
    
                    location /apis {
                            rewrite  ^/apis/(.*)$ /$1 break;
                            proxy_pass   http://127.0.0.1:3000/;
           }
    }

    加上这些后就可以正常访问啦。

  • 相关阅读:
    c# 基础算法(一) 九九乘法
    万能模糊查询SQL
    C#通过连接ODBC的方式调用存储过程
    《从设计到模式》学习笔记part1
    C#知识归纳
    Python之路
    Tomcat优化
    Zabbix 3.0 + Nginx + Mariadb
    Spark DataFrame ETL教程
    Python连接presto
  • 原文地址:https://www.cnblogs.com/lyps/p/10183949.html
Copyright © 2011-2022 走看看