web-dev-qa-db-de.com

Wie läuft mein Angular Site auf einem Mobilgerät, auf dem localhost auf meinem Windows-Desktop ausgeführt wird

Ich weiß aus dieser Frage und Antwort auf Super User Site auf localhost auf dem Desktop ausgeführt wird, ist auf Android-Gerät nicht erreichbar( PS: diese Frage wird auf der Frage im Link fortgesetzt) dass der Befehl ng serve einen schlecht konfigurierten Webserver öffnet.

Die Frage ist, wie ich meine Site auf einem Android-Gerät ausführen kann, ohne meine Site bereitzustellen. Ich werde versuchen, die Site unter Verwendung von Angular-CLI unter dieser URL http://192.168.0.168:4200 auszuführen.

androidnetworkinglocalhostwebserverangular-cli
20
H. Pauwelyn

versuchen Sie es mit der --Host-Option, wie in dieser Ausgabe beschrieben: https://github.com/angular/angular-cli/issues/1793 Kommentar von intellix.

  1. ng serve --Host 0.0.0.0
  2. Finden Sie Ihre lokale IP-Adresse, indem Sie this folgen
  3. Navigieren Sie von jedem Gerät im selben Netzwerk zu <local ip adress>:4200.

andernfalls versuchen Sie https://ngrok.com/ , um einen Tunnel von Ihrem lokalen Netzwerk zu Ihrem Computer localhost zu öffnen. Grundsätzlich leitet Ihr Computer den 4200-Port an eine externe IP-Adresse und einen Port weiter, auf den alle Geräte im Netzwerk zugreifen können.

35
Ahmed Musallam

  1. Überprüfen Sie zunächst die IP-Adresse Ihres Geräts.

    • Geben Sie unter Windows ipconfig in Eingabeaufforderung (IPv4 kopieren) ein.
    • Geben Sie auf dem Mac ifconfig |grep inet in Terminal (copy inet) ein.


    In meinem Fall ist dies 192.168.0.10.

  2. Geben Sie als Nächstes ng serve --Host 192.168.0.10 ein.

  3. Ok, Ihre App ist für alle Geräte im selben Netzwerk on air.

  4. Jetzt funktioniert nur noch http://192.168.0.10:4200/, localhost nicht mehr.

9
Shabbir Dhangot

Wenn ich es versucht habe 

ng serve --Host local ip address

Ich stand vor 

Ungültige Header-Anfrage

Dieses Problem wurde mit --disable-Host-check gelöst.

ng serve --Host local ip address --disable-Host-check

3
Ram Sharma

Als Ergänzung zu allen obigen Antworten müssen Sie möglicherweise die Proxy-Einstellungen Ihres Geräts anpassen. Für mein Android Phone war dies:

  1. Die Einstellungen
  2. W-lan
  3. Lang Klicken Sie auf das gewünschte Netzwerk
  4. Netzwerk ändern
  5. Klicken Sie auf Erweiterte/Erweiterte Optionen
  6. Setze proxyHostname: localhost und proxyPort: 4200 und bypassProxyFor: hostIpAddress
1
ballabimbim

für Ubuntu-Leute: erhalten Sie die IP-Adresse, indem Sie Folgendes in das Terminal schreiben: hostname -I

sie erhalten eine IP-Adresse wie 192.168.0.0

und dann können Sie die App einfach mit: ng serve --Host ip address bedienen.

und dann können Sie den Browser in Ihrem Handy einfach öffnen mit: http:// ip address:4200

0
Ahmed Alhisaie

Ich öffne meine Angular2-App auf einem mobilen Gerät mit Chrome Remote Device .

Sie müssen lediglich Ihr Telefon an Ihren PC anschließen und es mit Chrome synchronisieren. __ Dann machen Sie die Portweiterleitung wie unter dem Link oben beschrieben.

Führen Sie nach dem Verbinden Ihres Geräts Ihre Angular-App mit ng serve --public-Host aus.

Jetzt können Sie in localhost: 4200 über Ihr Mobilgerät auf Ihre App zugreifen. 

0
Kaloyan Stamatov

Ich öffne meine Angular2-App auf einem mobilen Gerät mit Chrome Remote Device .

Sie müssen lediglich Ihr Telefon an Ihren PC anschließen und es mit Chrome synchronisieren. __ Dann machen Sie die Portweiterleitung wie unter dem Link oben beschrieben.

Führen Sie nach dem Verbinden Ihres Geräts die Angular-App mit ng serve --public-Host aus.

Jetzt können Sie in localhost: 4200 über Ihr Mobilgerät auf Ihre App zugreifen. 

0
Kaloyan Stamatov