371 votes

Comment autoriser l'accès en dehors de localhost

Comment puis-je autoriser l'accès en dehors du localhost à Angular2 ? Je peux naviguer à localhost:3030/panel facilement mais je n'arrive pas à naviguer quand j'écris mon IP tel que 10.123.14.12:3030/panel/ .

Pourriez-vous me dire comment le réparer ? Je n'utilise pas npm (node project manage - node install/node start ) pour installer et exécuter le projet.

Si vous voulez, je peux vous fournir mon package.json y index.html .

1 votes

Utilisez-vous le service NG ?

1 votes

Oui, j'utilise le serveur ng

6 votes

Avez-vous essayé ng serve --host 10.123.14.12 ?

665voto

mast3rd3mon Points 1642

Utilisation de ng serve --host 0.0.0.0 vous permettra de vous connecter au ng serve en utilisant votre ip au lieu de localhost .

EDITAR

Dans les nouvelles versions du client, vous devez fournir votre adresse IP locale à la place.

EDIT 2

Dans les nouvelles versions du cli (je pense que la v5 et plus) vous pouvez utiliser 0.0.0.0 en tant qu'IP pour l'héberger et permettre à n'importe qui sur votre réseau d'y accéder.

A titre d'information Assurez-vous que votre connexion est définie comme publique dans les paramètres de votre système d'exploitation.

1 votes

Il est dit "vous devez être à l'intérieur d'un projet angluar--cli afin d'utiliser la commande serve" avec l'avertissement rouge quand j'écris ng sreve et aussi un message jaune qui indique que j'exécute la version 6.2.2 de Node, qui ne sera pas supportée dans les futures versions du CLI après avoir écrit ng serve

1 votes

Premièrement, essayez de mettre à jour le nœud, deuxièmement, essayez de redémarrer votre terminal/vscode

1 votes

Je l'ai mis à jour à partir de package json vers 6.0.46 comme "@types/node" : "6.0.46", mais j'obtiens toujours le même message

89voto

Palla Points 137

Exécuter la commande

ng serve --host=0.0.0.0 --disable-host-check

ceci désactivera la vérification de l'hôte et permettra l'accès depuis l'extérieur (au lieu de localhost) avec une adresse IP.

4 votes

Je n'avais pas besoin de --disable-host-check. ng serve --host 0.0.0.0 fonctionne bien pour moi. Que doit faire le contrôle de l'hôte ?

7 votes

Pour une fois, j'ai eu besoin de la disabled-host-check sinon, j'ai reçu le message "En-tête d'hôte invalide".

0 votes

Existe-t-il un moyen de le définir dans un fichier de configuration pour éviter de le mentionner à chaque fois ?

66voto

Sajad Points 408

Utilisateurs de Mac :

  1. Allez dans Préférences Système -> Réseau -> Wi-Fi
  2. Copiez l'adresse IP ci-dessous Statut (Habituellement 192.168.1.x)
  3. Collez-le dans votre service ng comme : ng serve --host 192.168.1.x

Ensuite, vous devez être en mesure de voir votre page sur d'autres appareils par le biais de 192.168.1.x:4200 .

1 votes

Ça marchait pour moi et ça ne marche plus. Je me demande pourquoi. J'ai l'impression d'avoir tout essayé ! Mon pare-feu est désactivé. ng serve --host 10.x.x.x --disable-host-check / ng serve --host 0.0.0.0 --disable-host-check -> Non accessible depuis une machine Windows distante qui est sur le même réseau que 10.x.x.x:4200

0 votes

Fonctionne bien avec Angular 7, et MacOS 10.14.6

0 votes

Pour ce que ça vaut, la réponse acceptée fonctionne pour moi sur MacOS à partir d'octobre 2019.

6voto

Rakesh Ranjan Points 31

Ouvrez cmd et naviguez vers l'emplacement du projet, c'est-à-dire l'endroit où vous exécutez npm install ou ng serve pour le projet.

puis exécutez la commande - ng serve --host 10.202.32.45 donde 10.202.32.45 est votre adresse IP.

Vous pourrez accéder à votre page à l'adresse suivante 10.202.32.45:4200 où 4200 est votre numéro de port.

Note : Si vous servez votre application en utilisant cette commande, vous ne serez pas en mesure d'accéder à localhost:4200

1 votes

Est-il possible d'accéder aux deux sens ?

0 votes

Ça marche, merci. Je suppose que je regardais la mauvaise adresse IP.

0 votes

Je sais que cela peut paraître idiot, mais assurez-vous que votre téléphone utilise le même réseau wifi que votre machine de développement. J'utilisais un réseau invité... +1 pour la seule réponse qui a fonctionné pour moi.

4voto

Zombie Points 1019

Vous pouvez également inspecter tout le trafic HTTP passant par vos tunnels en utilisant ngrok alors vous pouvez exposer en utilisant ngrok http --host-header=rewrite 4200

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X