GNU/Linux >> Tutoriels Linux >  >> Linux

NGINX en tant que proxy inverse pour l'application Node ou Angular

Un proxy inverse est un serveur qui récupère des ressources pour les clients à partir d'un ou plusieurs serveurs en amont. Il se place généralement derrière un pare-feu dans un réseau privé et transmet la demande des clients à ces serveurs en amont. Un proxy inverse améliore considérablement la sécurité, les performances et la fiabilité de toute application Web.

De nombreuses applications Web modernes écrites en NodeJS ou Angular peuvent fonctionner avec leur propre serveur autonome, mais elles manquent d'un certain nombre de fonctionnalités avancées telles que l'équilibrage de charge. , sécurité , et accélération que la plupart de ces applications exigent. NGINX avec ses fonctionnalités avancées peut agir comme un proxy inverse tout en répondant à la demande d'une application NodeJS ou Angular.

Serveur proxy inverse NGINX

Dans ce didacticiel, nous allons explorer comment NGINX peut être utilisé comme serveur proxy inverse pour un nœud ou une application angulaire. Le diagramme ci-dessous vous donne un aperçu du fonctionnement du serveur proxy inverse, traite les demandes des clients et envoie la réponse.

Proxy inverse Nginx

Prérequis

  • Vous avez déjà installé NGINX en suivant notre tutoriel à partir d'ici.

Hypothèse

  • Le serveur NGINX est accessible depuis le domaine public.
  • L'application Node ou Angular s'exécutera dans un système séparé (serveur en amont) dans un réseau privé et sera accessible depuis le serveur NGINX. Bien qu'il soit tout à fait possible de faire les configurations dans un seul système.
  • Le didacticiel utilise des variables telles que SUBDOMAIN.DOMAIN.TLD et PRIVATE_IP . Remplacez-les par vos propres valeurs aux endroits appropriés.

Application NodeJS

En supposant que vous avez déjà installé NGINX dans votre environnement, créons un exemple d'application NodeJS qui sera accessible via le proxy inverse NGINX. Pour commencer, configurez un environnement de nœud dans un système résidant dans votre réseau privé.

Installer le nœud

Avant de procéder à l'installation de NodeJS et de la dernière version de npm (node ​​package manager), vérifiez s'il est déjà installé ou non :


# node --version 
# npm --version

Si les commandes ci-dessus renvoient la version de NodeJS et NPM, ignorez l'étape d'installation suivante et passez à la création de l'exemple d'application NodeJS.

Pour installer NodeJS et NPM, utilisez les commandes suivantes :


# apt-get install nodejs npm

Une fois installé, vérifiez à nouveau la version de NodeJS et NPM.


# node --version
# npm --version

Créer un exemple d'application Node

Une fois l'environnement NodeJS prêt, créez un exemple d'application à l'aide d'ExpressJS. Par conséquent, créez un dossier pour l'application de nœud et installez ExpressJS.


# mkdir node_app  
# cd node_app
# npm install express

Maintenant, à l'aide de votre éditeur de texte préféré, créez app.js et ajoutez-y le contenu suivant.


# vi app.js
const express = require('express')
const app = express()
app.get('/', (req, res) => res.send('Hello World !'))
app.listen(3000, () => console.log('Node.js app listening on port 3000.'))

Exécutez l'application de nœud à l'aide de la commande suivante :


# node app.js

Effectuez une requête curl sur le port numéro 3000 pour confirmer que l'application s'exécute sur localhost.


# curl localhost:3000
Hello World !

À ce stade, l'application NodeJS sera exécutée sur le serveur en amont. Dans la dernière étape, nous configurerons NGINX pour qu'il agisse en tant que proxy inverse pour l'application de nœud ci-dessus. Pour l'instant, procédons à la création d'une application angulaire dont les étapes sont décrites ci-dessous :

Application angulaire

Angular est un autre framework JavaScript pour développer des applications Web à l'aide de dactylographie. En général, une application angulaire est accessible via le serveur autonome qui est livré avec elle. Mais en raison de quelques inconvénients liés à l'utilisation de ce serveur autonome dans un environnement de production, un proxy inverse est placé devant une application angulaire pour mieux la servir.

Configurer l'environnement angulaire

Étant donné qu'Angular est un framework JavaScript, il nécessite d'avoir Nodejs avec la version> 8.9 installé dans le système. Par conséquent, avant de procéder à l'installation de la CLI angulaire, configurez rapidement l'environnement du nœud en exécutant la commande suivante dans le terminal.


# curl -sL https://deb.nodesource.com/setup_10.x | sudo bash -
# apt-get install nodejs npm

Procédez maintenant à l'installation d'Angular CLI qui nous aide à créer des projets, à générer du code d'application et de bibliothèque pour toute application angulaire.


# npm install -g @angular/cli

La configuration nécessaire pour l'environnement angulaire est maintenant terminée. Dans l'étape suivante, nous allons créer une application angulaire.

Créer une application angulaire

Créez une application angulaire à l'aide de la commande CLI angulaire suivante :


# ng new angular-app

Accédez au répertoire angulaire nouvellement créé et exécutez l'application Web en spécifiant le nom d'hôte et le numéro de port :


# cd angular-app
# ng serve --host PRIVATE_IP --port 3000

Effectuez une requête curl sur le numéro de port 3000 pour confirmer que l'application angulaire s'exécute sur localhost.


# curl PRIVATE_IP:3000

À ce stade, l'application angulaire sera exécutée sur votre serveur en amont. Dans l'étape suivante, nous configurerons NGINX pour qu'il agisse en tant que proxy inverse pour l'application angulaire ci-dessus.

Configurer NGINX en tant que proxy inverse

Accédez au répertoire de configuration de l'hôte virtuel NGINX et créez un bloc de serveur qui agira comme un proxy inverse. N'oubliez pas que le système sur lequel vous avez installé NGINX précédemment est accessible via Internet, c'est-à-dire qu'une adresse IP publique est associée au système.


# cd /etc/nginx/sites-available
# vi node_or_angular_app.conf

server {  
              listen 80;
              server_name SUBDOMAIN.DOMAIN.TLD;
              location / {  
                           proxy_pass https://PRIVATE_IP:3000;  
                           proxy_http_version 1.1;  
                           proxy_set_header Upgrade $http_upgrade;  
                           proxy_set_header Connection 'upgrade';  
                           proxy_set_header Host $host;  
                           proxy_cache_bypass $http_upgrade;  
               }  
}

La directive proxy_pass dans la configuration ci-dessus oblige le serveur à bloquer un proxy inverse. Tout le trafic destiné au domaine SUBDOMAIN.DOMAIN.TLD et ces correspondances avec le bloc d'emplacement racine (/) seront transmises à https://PRIVATE_IP:3000 où le nœud ou l'application angulaire est en cours d'exécution.

Proxy inverse NGINX pour l'application NodeJS et Angular ?

Le bloc de serveur ci-dessus agira comme un proxy inverse pour le nœud ou l'application angulaire. Pour servir à la fois le nœud et l'application angulaire en utilisant le proxy inverse NGINX, exécutez-les simplement dans deux numéros de port différents si vous avez l'intention d'utiliser le même système pour les deux.

Il est également tout à fait possible d'utiliser deux serveurs en amont distincts pour exécuter le nœud et l'application angulaire. De plus, vous devez également créer un autre bloc de serveur NGINX avec des valeurs correspondantes pour server_name et proxy_pass directives.

Lecture recommandée  :Comprendre le fichier de configuration NGINX.

Vérifiez toute erreur syntaxique dans le bloc de serveur ci-dessus et activez-le. Enfin, rechargez NGINX pour appliquer les nouveaux paramètres.


# nginx -t
# cd /etc/nginx/sites-enabled
# ln -s ../sites-available/node_or_angular_app.conf .
# systemctl reload nginx

Pointez maintenant votre navigateur Web préféré vers https://SUBDOMAIN.DOMAIN.TLD , vous serez accueilli par un message de bienvenue de l'application Node ou Angular.

Page d'accueil angulaire

Résumé

C'est tout pour configurer un proxy inverse NGINX pour l'application NodeJS ou Angular. Vous pouvez maintenant procéder à l'ajout d'un certificat SSL gratuit comme Let's Encrypt pour sécuriser votre application !


Linux
  1. Comment configurer un proxy inverse Nginx

  2. Guide d'exécution d'un proxy inverse pour HTTP(S), SSH et MySQL/MariaDB à l'aide de NGINX

  3. Proxy inverse avec Nginx :un guide de configuration étape par étape

  4. Configurer Apache pour WebSockets à l'aide du proxy inverse

  5. Configurer WSO2 avec le proxy inverse NGINX pour les URL personnalisées

Comment configurer Nginx en tant que proxy inverse pour Apache sur Debian 11

Comment configurer le proxy inverse Nginx

Comment configurer Nginx en tant que proxy inverse pour Apache sur Ubuntu 18.04 VPS

Comment configurer Tomcat avec Nginx en tant que proxy inverse sur Ubuntu 18.04

Comment configurer Apache en tant que serveur proxy frontal pour Node.js CentOS 8

Comment installer NGINX en tant que proxy inverse pour Apache sur Ubuntu 18.04