通过Nginx代理服务时,Vue App路由不起作用

时间:2020-06-11 07:56:23

标签: vue.js nginx

我正在通过Nginx服务器上的proxy_pass提供Vue应用。这是我的配置,如下所示:

location /iframe/reports/ {
  proxy_pass http://reports-frontend/reports;
  proxy_set_header Host $host;  
}

location ^~ /js/ {
  proxy_pass http://reports-frontend/js/;
}

location ^~ /css/ {
  proxy_pass http://reports-frontend/css/;
}

我的Vue应用程序在具有以下配置的Nginx docker容器中运行:

user  nginx;
worker_processes  1;
error_log  /var/log/nginx/error.log warn;
pid        /var/run/nginx.pid;
events {
  worker_connections  1024;
}
http {
  include       /etc/nginx/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  /var/log/nginx/access.log  main;
  sendfile        on;
  keepalive_timeout  65;
  server {
    listen       80;
    server_name  localhost;
    location / {
      root   /app;
      index  index.html;
      try_files $uri $uri/ /index.html;
    }
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
      root   /usr/share/nginx/html;
    }
  }
}

当我请求localhost:8080 / iframe / reports时,我可以获取index.html和所需的资产。但是路由似乎无法正常工作。为什么会这样?

谢谢!

0 个答案:

没有答案