web-dev-qa-db-ja.com

Windowsデスクトップでlocalhostを実行しているモバイルデバイスでAngularサイトを実行する方法

私はこの質問とスーパーユーザーに関する回答から知っています デスクトップ上のローカルホストで実行されているサイトはAndroidデバイスで到達不能です（PS：この質問はリンク内の質問に続きます）コマンドng serveが設定されたWebサーバーを正しく開かない。

問題は、サイトを展開せずにAndroidデバイスでサイトを実行する方法です。 Angular-CLIを使用して、このURL http://192.168.0.168:4200でサイトを実行しようとします。

androidnetworkinglocalhostwebserverangular-cli
34
H. Pauwelyn

この問題で説明されているように--Hostオプションを提供してみてください： https://github.com/angular/angular-cli/issues/179 intellixによるコメント。

  1. ng serve --Host 0.0.0.0
  2. this に従ってローカルIPアドレスを見つけます
  3. 同じネットワーク上の任意のデバイスから<local ip adress>:4200に移動します。

それ以外の場合は、 https://ngrok.com/ を試して、ローカルネットワークからコンピューターのローカルホストへのトンネルを開きます。基本的に、コンピューターは4200ポートをネットワーク上の任意のデバイスがアクセスできる外部IPおよびポートに転送します。

59
Ahmed Musallam

  1. まず、マシンのIPアドレスを確認します。

    • Windowsでは、プロンプトにipconfigと入力します（IPv4をコピーします）。
    • Macでは、ターミナルにifconfig |grep inetと入力します（inetをコピーします）。


    私の場合、これは192.168.0.10です。

  2. 次に、ng serve --Host 192.168.0.10と入力します。

  3. わかりました、同じネットワーク上のすべてのデバイスのオンエアのアプリ。

  4. 現在、http://192.168.0.10:4200/のみが機能し、localhostは機能しません。

15
Shabbir Dhangot

使ってみたとき

ng serve --Host local ip address

私は直面していた

無効なヘッダーリクエスト

この問題は--disable-Host-checkを使用して解決されました

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

4
Ram Sharma

上記のすべての回答に加えて、デバイスのプロキシ設定を調整する必要がある場合があります。私のAndroid電話の場合、これは次のとおりでした。

  1. 設定
  2. Wi-Fi
  3. 目的のネットワークをロングクリックします
  4. ネットワークを変更
  5. 詳細/拡張オプションをクリックします
  6. proxyHostname: localhostおよびproxyPort: 4200およびbypassProxyFor: hostIpAddressを設定します
1
ballabimbim

ubuntuの場合：ターミナルでhostname -Iと書いているIPアドレスを取得します

192.168.0.0のようなIPアドレスを取得します

ng serve --Host ip addressでアプリを提供できます

そして、あなたはあなたの携帯電話でブラウザを開くことができます：http:// ip address:4200

0
Ahmed Alhisaie

Chromeリモートデバイス を使用して、モバイルデバイスでAngular2アプリを開きます。

携帯電話をPCに接続し、クロムと同期するだけです。上記のリンクで説明されているようにポート転送を行うよりも。

デバイスを接続したら、Angularアプリをng serve --public-Hostで実行します

これで、モバイルデバイスからlocalhost：4200でアプリにアクセスできます。

0
Kaloyan Stamatov

Chromeリモートデバイス を使用して、モバイルデバイスでAngular2アプリを開きます。

携帯電話をPCに接続し、クロムと同期するだけです。上記のリンクで説明されているようにポート転送を行うよりも。

デバイスを接続した後、Angularアプリサービスをng serve --public-Hostで実行します

これで、モバイルデバイスからlocalhost：4200でアプリにアクセスできます。

0
Kaloyan Stamatov