Étiquette : localhost

[Docker][NodeJS] Utiliser Docker pour créer un environnement de développement NodeJS

Source: Use Docker to Create a Node Development Environment et version PDF pour la postérité. Tutoriel (en anglais) extrêmement détaillé et très bien expliqué.

Repo Git: Use Docker to Create a Front-End Node JS Development Environment.

Ce tutoriel m’a permis:

  • d’exécuter NPM depuis un container Docker sans avoir à procéder à une installation locale de NodeJS (écarte les problèmes liés à l’obligation de jongler avec différentes version de Node/NPM en fonction de l’âge du projet).
  • de lancer un serveur Node JS via Express.
  • d’accéder à localhost dans un navigateur.

Pour aller encore plus loin (pas lu l’article en entier, mais il est ressorti dans mes résultats de recherche lorsque j’ai trouvé le tuto dont je parle juste au-dessus et me paraît intéressant à conserver pour améliorer ma pratique de Docker): A Better Way to Develop Node.js with Docker (I’ve seen a lot of articles lately suggesting how to use Docker for development. I haven’t seen one yet that does it correctly). Version PDF pour la postérité.

[crossbrowsertesting.com] Erreur « Invalid Host Header » où comment accéder à un site en localhost

Source: What is this “Invalid Host Header” error?

Dans le cadre d’un projet Angular

Angular CLI 6 dans mon exemple, mais voir la documentation officielle de Cross Browser Testing pour des projets Angular 2 ou Webpack.

  1. Stopper le serveur (si il tourne) et le relancer en incluant les paramètres suivants dans la commande: --host 0.0.0.0 --disableHostCheck=true.

    Si vous utilisez NPM et que vous exécutez votre serveur via un npm start, éditez le fichier package.json (ligne « scripts » > « start ») pour y ajouter les paramètres cités plus haut. Exemple:

  2. Sur Quel Est Mon IP, récupérez votre IP Locale (qui commence probablement par 192.168… Dans mon cas 192.168.67.219).
  3. Dans l’interface de crossbrowsertesting, commencer par activer la connexion locale (depuis le bandeau « Local Connection OFF/ON »)
  4. Taper dans la barre d’adresse de l’appli: http://votre_IP_locale:4200 (exemple: http://192.168.67.219:4200/)

[Angular CLI] Avoir son serveur Angular dans une Machine Virtuelle Ubuntu Server et accéder à localhost depuis Windows

Ressource en ligne: How to allow access outside localhost.

Problème

J’ai une appli Angular qui tourne dans une machine virtuelle Ubuntu Server (sous Virtual Box). Lorsque je tape la commande ng serve, la compilation s’effectue correctement et j’ai un message de log qui me dit: ** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **.

Problème: je n’ai pas accès à l’application à l’adresse http://localhost:4200/ depuis mon navigateur sous Windows.

Solution

Dans la machine virtuelle, commencer par taper ifconfig. Il faut alors récupérer la valeur de eth1 > inet adr (dans mon exemple ci-dessous: 192.168.56.101).

eth1 Link encap:Ethernet HWaddr 08:00:27:99:e5:9a
inet adr:192.168.56.101 Bcast:192.168.56.255 Masque:255.255.255.0
adr inet6: fe80::a00:27ff:fe99:e59a/64 Scope:Lien
UP BROADCAST RUNNING MULTICAST MTU:1500 Metric:1
Packets reçus:10502 erreurs:0 :0 overruns:0 frame:0
TX packets:19907 errors:0 dropped:0 overruns:0 carrier:0
collisions:0 lg file transmission:1000
Octets reçus:680007 (680.0 KB) Octets transmis:27440635 (27.4 MB)

Ensuite, toujours dans la machine virtuelle, taper ng serve --host 192.168.56.101 (remplacer l’IP dans mon exemple par votre propre IP, bien-sûr).

Puis, dans votre navigateur, taper l’URL qui vous est donnée par le log (avec mon exemple: http://192.168.56.101:4200/).

La config réseau de ma VM sous Virtual Box (au cas où)

Si la solution plus haut ne fonctionne pas, vérifier peut-être la config réseau de votre machine virtuelle. Dans l’application Virtual Box (sous Windows cette fois…) clic droit sur votre VM > Configuration > onglet Réseau > onglet Carte 1. Chez moi, j’ai ceci: