Comment configurer NGINX pour déployer différentes applications à une page (SPA … c’est-à-dire des fichiers statiques) en fonction de l’emplacement (sous le même nom_serveur) avec des sous-routines

Mon objective est de configurer deux applications d’une seule page (SPA) sous le même domaine, où nous montrons le SPA correspondant à l’emplacement / au chemin demandé. Je souhaite également utiliser par défaut l’un des deux SPA sur / location. Et .. Je veux que les chemins d’emplacement de l’historique html5 ajoutés par le SPA soient réellement acheminés au bon endroit si quelqu’un entre l’URL dans le navigateur.

Il est plus facile d’expliquer avec un exemple.

Exemple:

Les navs utilisateur sur mydomain.com/app et le serveur servent des contenus sous / home / user / app / dist (qui a un index.html et tous les actifs js / css) (utiliser linux donc / home / user est juste mon répertoire personnel) chemin).

Navs utilisateur à mydomain.com/auth et le serveur sert le contenu sous / home / user / auth / dist

La navigation de l’utilisateur vers / et le serveur sert le contenu sous / home / utilisateur / auth / dist (/ navs à authentifier par défaut)

L’utilisateur se connecte à mydomain.com/auth/login et le serveur sert encore une fois le contenu sous le dossier / home / user / auth / dist, mais l’URL rest mydomain.com/auth/login afin que l’authentification SPA puisse être utilisée comme route

La navigation de l’utilisateur sur mydomain.com/auth/signup et le serveur, encore une fois, servent à nouveau le contenu sous / home / user / auth / dist, l’url rest mydomain.com/auth/login afin que l’auth SPA puisse l’utiliser comme route

l’utilisateur navs à mydomain.com/app/home et le serveur sert le contenu sous / home / user / app / dist

J’ai essayé les règles root / alias / rewrite / regex / = / ^ ~. J’essaie de mieux comprendre l’installation de nginx, mais en attendant, voici ce que j’ai actuellement:

server { listen [::]:80 default_server; listen 80; server_name mydomain.com 127.0.0.1; # Make it serve in mydomain.com # ^~ rules stop matching after the exact match location ^~ /app { # if location start matches /app alias /home/user/app/dist; index index.html; try_files $uri $uri/ index.html =404; } # if location start matches app/lobby location ^~ /app/home { alias /home/user/app/dist; index index.html; try_files $uri $uri/ index.html =404; } # you can see that I need to add a new one per each client js app route location ^~ /app/home/visitor { alias /home/user/app/dist; index index.html; try_files $uri $uri/ index.html =404; } location ^~ /auth/login { alias /home/user/auth/dist; index index.html; try_files $uri $uri/ index.html =404; } location ^~ /auth { alias /home/user/auth/dist; index index.html; try_files $uri $uri/ index.html =404; } # Rewrites / to auth, appending whatever params to path # var (for the client to consume)for now location / { rewrite ^/(.*) /auth?path=$1 last; } } } 

Il devrait trouver un index.html sous le dossier / dist

Je voudrais utiliser des expressions régulières ou une correspondance d’emplacement qui laisse passer le rest de la correspondance pour l’application client js, de sorte que je n’ai pas à append une nouvelle règle pour chaque route (cette application a réellement un état nested routes). Je sais que le modificateur location ^ ~ s’arrête après la correspondance avec la règle spécifique, mais je n’ai pas pu le faire fonctionner autrement. Si je n’utilise pas un modificateur, une correspondance régulière avec une expression, ou le modificateur =, je reçois juste 404, 403 et 500 réponses de nginx.

De plus, si je cesse d’utiliser alias / rewrite et que j’utilise le mot-clé root, il essaie de trouver / app ou / auth des dossiers réels sous le dossier dist, ce qui ne devrait pas être le cas (comme si / home / user / auth / dist / le dossier auth existait).

Je demande également au client de savoir quel est le répertoire de base de chaque SPA, par exemple basedir = “app” (pour l’application un) et basedir = “auth” pour l’auth.

Je pense que je fais mal la réécriture, ou j’ai besoin de plus de réécritures, ou de règles supplémentaires pour rendre les choses plus génériques.

Comment vais-je faire ça? Une sorte de configuration d’échantillon serait appréciée. Merci.

Ps j’utilise Ember avec Ember-cli si quelqu’un est curieux. Cela génère le dossier dist / avec une application intégrée et peut également autoriser des itinéraires tels que http: //www.mydomain/app/home/visitor/comments/new, ce qui explique pourquoi il est inutile de coder en dur chaque chemin (et le l’application est encore en développement, plus d’itinéraires à venir!).

MODIFIER

J’ai aussi essayé ceci, et je reçois juste 404 dans les deux chemins / app et / auth:

 server { listen [::]:80 default_server; listen 80; server_name localhost mydomain.com 127.0.0.1; index index.html; location /app { root /home/user/app/dist; try_files $uri $uri/index.html index.html; } location /auth { root /home/user/auth/dist; try_files $uri $uri/index.html index.html; } } 

Avant toute chose, assurez-vous de ne pas avoir de configuration default pour les sites-enabled cela peut parfois entraîner un comportement inattendu.

EDIT: Configuration finale ci-dessous

 server { listen [::]:80 default_server; listen 80; server_name localhost mydomain 127.0.0.1; location /app { alias /home/user/app/dist/; index index.html; try_files $uri $uri/ index.html =404; } location /auth { alias /home/user/auth/dist/; index index.html; try_files $uri $uri/ index.html =404; } location / { rewrite ^/(.*) /auth?$1 last; } } 

Cela vaut également la peine de vérifier cette question et les documents nginx qui expliquent un peu plus les différences entre root et alias.