Angular / cli開発サーバーc9.ioを実行しているときの「無効なホストヘッダー」

現在のコマンド： ng serve --host --public $IP:$PORT

私のウェブサイトの結果：

無効なホストヘッダー

--disable-host-checkあなたはCloud9から実行する必要がある場合にフラグが罰金を動作します。

次のコマンドを使用します。

ng serve --open --host $IP --port $PORT --disable-host-check

ホストを指定する必要があります

ng serve --port 8080 --host 123.34.56.78

この問題を参照してください

node_modules/webpack-dev-server/lib/Server.js（425行目）の次の行を編集し、次のよう に変更します。

return true;

cloud9 IDEを使用してから、以下を実行しますng serve --port 8080 --host 0.0.0.0。これで正常に動作します。

これは私のために働きます：

ngrok http --host-header=rewrite PORT

例えば ​​：

ngrok http --host-header=rewrite 4200

私の場合、ホスト名を使用して/ etc / hostsファイルを更新します。

vi /etc/hosts

最後の行にホスト名を追加します。

127.0.0.1 myHostName.com

サーバーに接続するには、

ng serve -o

myHostName.com:4200への接続中にエラーが発生しました。

だから、私はこれが好きでした、

ng serve --host 0.0.0.0 --disableHostCheck true

myHostName.com:4200に再接続しています :)

以下を実行する必要があります。

ng serve --port 8080 --publicHost 123.34.56.78 // your server ip or host name.

私のために働きます。

以下のコマンドを使用するとうまくいきます。

ng serve --host 0.0.0.0 --port 8080  --public ipAddress

angle.jsonで、アーキテクト->サーブ->オプションの下に以下を追加します

"disableHostCheck": true

このGithubIssueページから回答を得ました

bitnamiイメージを持つAWSEC2インスタンスにAngularアプリをデプロイした後、同じエラーに直面していました。次に、以下のコマンドでアプリを起動しましたが、正常に動作しました。

ng serve --host 0.0.0.0 --port 8080 --disableHostCheck true

以下のコマンドを使用すると、AngularCLIで機能します。6.0.7

ng serve --host 0.0.0.0 --port 8080 --disableHostCheck

以下のバージョンのAngularとサーバーAmazonでテスト済み。

Angular CLI: 6.0.8
Node: 8.11.3
OS: linux x64
Angular: 5.2.8

ngコマンドオプションが変更されました。configuration代わりにを使用してくださいenv。私のために働いたコマンドは

 ng serve --configuration=dev  --port 4009 --host 0.0.0.0 --publicHost myhost.com

--disable-host-checkパブリックサーバーでは絶対に使用しないでください。これを使用すると、Angularは警告を表示します。動作する可能性はありますが、重大なセキュリティ問題です。そのフラグを使用すると、このメッセージが表示されます。

警告：-disable-host-checkを指定してサーバーを実行すると、セキュリティ上のリスクが発生します。詳細については、https：//medium.com/webpack/webpack-dev-server-middleware-security-issues-1489d950874a を参照して ください。

読む価値のある記事を読むのに少し時間がかかります。

これは実際にMateuszSawaのおかげでyoutubeビデオコメントの1つで解決されました

行くここでそれをチェックアウトします。

--package.jsonでホストを指定しても機能しなくなりました-

ビデオで使用されたコマンドを使用する必要がないことに注意してください。通常のangular-cli開発を使用してアプリを機能させるには、以下の手順で十分です。

まず、etc /フォルダーでホストを見つける必要があります

cd ..Linuxマシンのルートに到達するまでコンソールに入力し、lsリストされているものを常に確認してください

あなたが見た場合、ホストのファイルを、あなたは右の場所にあり、より使いsudo vi hosts編集に

すべてのIPアドレス「0.0.0.0yourworkspace-yourusername.c9users.io」の下に次の行を追加します（もちろん引用符なし:-)）

また、package.jsonで「start」を変更します：「ngserve -H yourworkspace-yourusername.c9users.io」

次に、アプリケーションフォルダーに移動し、ターミナルでアプリを起動する必要があります。 npm start

今それをチェックして、それはうまくいきました

最新バージョンのAngularCLIで以下のコマンドを使用するとうまくいきます。

ng serve --host 0.0.0.0 --public-host <workspace>-<username>.c9users.io

以下の両方のソリューションが機能します。コマンドラインで：

ng serve --public --host yourip --port yourportnumber

ng serve --host 0.0.0.0 --port yourport --disableHostCheck true

同じエラーが発生しました。公的オプションは私にとって以下のような問題を解決しました：

ng serve --host 0.0.0.0 --port 8080 --live-reload-port 8081 --public $C9_HOSTNAME

ng serve --host 0.0.0.0 --port 1234 --public-host mydomain.com

これは私にとってはうまくいきます。

参照：https：//github.com/angular/angular-cli/issues/6070

公開フラグを使用します。例えば：ng serve --host <workspace>-<username>.c9users.io --public

0.0.0.0を192.168.1.42のようなローカルIPアドレスに変更するだけで、機能するはずです。

ng serve --host 192.168.1.42

重要なのは、-publicパラメータで指定したリンクにのみアクセスできるということです。私の場合、-publicでIPアドレスを指定し、そのIPに対して登録したドメインでIPアドレスにアクセスしようとしました。ただし、ngは、-publicで提供される唯一のホストにバインドします。

この問題を解決するために、もう1つのパラメーターを指定しましたdisable-host-check。完全なコマンド：ng serve --disable-host-check --host 0.0.0.0 --port 3100 --public x.x.x.x

詳細については、ここをクリックしてください

localtunnelユーティリティを使用してアプリにアクセスしようとすると、このエラーが発生していました。

コマンドに追加--disableHostCheck trueするという@tarnの提案（受け入れられた回答へのコメントから）がうまくいきましたng serve。

誰かがまだinvalid host header問題で立ち往生している場合の解決策は次のとおりです。

実行ng ejectすると、が作成されますwebpack.config.js。npm install要求されている場合は実行します。以下"disableHostCheck":trueをdevServer に追加しますwebpack.config.js。以下のように：

"devServer": {
    "historyApiFallback": true,
    "disableHostCheck" : true //<-- add this line
  }

次に、このようなpackage.jsonファイル変更startオプションでng

"start": "webpack-dev-server --host 0.0.0.0 --port YOURPORT --public YOURIP:YOURPORT"

次に、angularwithnpm startコマンドを実行します。それでおしまい。

すべての回避策に感謝します。-disable-host-checkは機能しますが、なぜその回避策を使用する必要があるのか​​、他の新しいアプリケーションのように機能できないのかわかりません。

これを試してみてください

ng serve --host <private IP> --port <host port> --public-host <public IP>

ファイル「node_modules / webpack-dev-server / lib /Server.js」の425行目をfalseからtrueに変更します。すなわち、

前：falseを返します。

更新：trueを返します。