Nginx 反向代理服务 Node.js 应用程序静态文件

Question

我有一个 Laravel 应用程序，其中一条路线 /onlineAds 将带我到另一个应用程序（一个 SPA 应用程序），该应用程序以 Vue.Js 作为前面，Node.js 作为后面。所以我尝试使用 Nginx 作为反向代理来为我的 SpaApp 的静态文件提供服务，但没有成功。

我的配置如下：

/                   =>      will be serverd from "C:/laragon/www/laravel_App/public/"
/onlineAds/(*)      =>      will be serverd from "C:/laragon/www/VueNodeApp/dist/"
/api/(*)            =>      will be proxied to nodeJs server

这是我尝试用 Nginx 做的事情：

server {
  listen 8080;
  server_name domain.test *.domain.test;
  root "C:/laragon/www/laravel_App/public/";

  index index.html index.htm index.php;

  location / {
      try_files $uri $uri/ /index.php$is_args$args;
      autoindex on;
  }

  location ~* ^\/onlineAds(.*)$ {
      alias "C:/laragon/www/craiglist/dist/";
      #try_files $uri $uri/ /index.html;
  }

  location ~* ^\/api(.*)$ {
      proxy_set_header        Host $host;
      proxy_set_header        Upgrade $http_upgrade;
      proxy_set_header        Connection 'upgrade';
      proxy_set_header        X-Real-IP $remote_addr;
      proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header        X-Forwarded-Proto $scheme;

      proxy_read_timeout      300;
      proxy_pass              http://localhost:8081;
  }

  location ~ \.php$ {
      include snippets/fastcgi-php.conf;
      fastcgi_pass php_upstream;        
      #fastcgi_pass unix:/run/php/php7.0-fpm.sock;
  }


  charset utf-8;

  location = /favicon.ico { access_log off; log_not_found off; }
  location = /robots.txt  { access_log off; log_not_found off; }
  location ~ /\.ht {
      deny all;
  }
}

我做错了什么？

Answer 1

正则表达式中的alias语句location需要文件的完整路径。有关详细信息，请参阅 this document。

例如：

location ~* ^\/onlineAds(.*)$ {
    alias "C:/laragon/www/craiglist/dist";
    if (!-e $request_filename) { rewrite ^ /onlineAds/index.html last; }
}

由于 if.

的使用 this issue. See this caution，因此避免了 try_files 与 alias 的使用

假设 URI /js/foo.js 可以位于 C:/laragon/www/laravel_App/public/js/foo.js 或 C:/laragon/www/craiglist/dist/js/foo.js，您可以要求 Nginx 使用 try_files 和公共 [=21] 来尝试这两个位置=] 目录.

例如：

location /js/ {
    root "C:/laragon/www";
    try_files /laravel_App/public$uri /craiglist/dist$uri =404;
}
location /css/ {
    root "C:/laragon/www";
    try_files /laravel_App/public$uri /craiglist/dist$uri =404;
}

Nginx 反向代理服务 Node.js 应用程序静态文件

Nginx reverse proxy Serving Node.js app static file

nginx

node.js

single-page-application

vue.js

nginx-reverse-proxy