nginx配置vue项目 统一端口转发vue不同的路由

Question

项目部署时 nginx 配置vue项目统一端口转发vue不同的路由

求各位大神出个方案

环境试linux  

项目使用的jeecg-boot框架

目前的配置时这样子的，

 

#user  nobody;
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;
    sendfile        on;
    keepalive_timeout  65;
    gzip on;
    gzip_min_length 1k;
    gzip_comp_level 9;
    gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
    gzip_vary on;
    gzip_disable "MSIE [1-6]\.";
    server{
        listen       80;
        location / {
             root   /home/web/yaoyuan;
            try_files $uri $uri/ /index.html;
            index  index.html index.htm;
        }
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

    }
    server{
        listen       80;
        server_name admin.xxxxxx.xx;
        location / {
            root   /home/web/xxxx;
            try_files $uri $uri/ /index.html;
            index  index.html index.htm;
        }
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;    
        }
    }

   server{
        listen       90;
        server_name www.xxxx.xxx;
        location / {
            #admin.xxxx.xxx/shoppingMall/Index/Index
            proxy_pass http://127.0.0.1/shoppingMall/Index/Index;
        }
        
        location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
        {
           proxy_pass http://admin.xxx.xxxx;
        }

        location ~* .(js|css)$ {
        proxy_pass http://admin.xxxxx.xxxx;
        }

        location ~ .*\.(js|css)?$
        {
            proxy_pass http://admin.xxxxxx.xxxxxx;
        }
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

    }

}

Answer 1

看一下jeecg-boot官方文档：望采纳，谢谢

vue路由带参总结
1. params
<router-link :to="{name:'test', params: {id:1}}">
配置路由格式要求: path: "/test/:id"
js参数获取：this.$route.params.id

2.query
<router-link :to="{name:'test', query: {id:1}}">
配置路由:无要求
js参数获取：this.$route.query.id

备注：
router-link是html写法，JS中语法如下：
this.$router.push({name:'test',query: {id:'1'}})
this.$router.push({name:'test',params: {id:'1'}})