web-dev-qa-db-ja.com

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

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

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

無効なホストヘッダー

angularangular-clic9.io
49
Olejs

Cloud9から実行する必要がある場合、--disable-Host-checkフラグは正常に機能します。

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

ng serve --open --Host $IP --port $PORT --disable-Host-check
65
Rodolfo Díaz

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

ng serve --port 8080 --Host 123.34.56.78
23
Adetiloye Philip Kehinde

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

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

return true;

私はcloud9 IDEを使用しています。その後、ng serve --port 8080 --Host 0.0.0.0を実行します。正常に動作するようになりました。

20
kegliz

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

ng serve --Host 0.0.0.0 --port 8080  --public ipAddress
8
Devesh Vyas

以下を実行する必要があります。ng serve --port 8080 --publicHost 123.34.56.78（サーバーのIPまたはホスト名）。私のために働く。

6
Nitin Tyagi

Angular CLIの場合、次のコマンドを使用してください：6.0.7

ng serve --Host 0.0.0.0 --port 8080 --disableHostCheck
5
Eastbrook

Bitnamiイメージを持つAWS EC2インスタンスにangularアプリをデプロイした後、同じエラーに直面していました。次に、以下のコマンドでアプリを起動しましたが、うまくいきました。

ng serve --Host 0.0.0.0 --port 8080 --disableHostCheck true
5
Manish Bansal

以下のバージョンの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 を参照してください。

読む価値があるその記事を読むのに時間をかけてください。

4
Krishnadas PC

これは私のために動作しますngrok http --Host-header = rewrite PORT

例えば：ngrok http --Host-header = rewrite 4200

4
Nelson Cespedes

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

here に移動して確認します。

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

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

最初に、hostsをetc /フォルダーで見つける必要があります

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

hostsファイルが表示されている場合は、正しい場所にいるので、Sudo vi hostsを使用して編集します

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

package.jsonの変更「start」：「ng serve -Hyourworkspace-yourusername.c9users.io」

その後、アプリケーションフォルダーに移動し、ターミナルでnpm startを使用してアプリを起動するだけです。

今それをチェックして、それは働いた

3
Vlastimir Radojevic

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

vi /etc/hosts

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

127.0.0.1 myHostName.com

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

ng serve -o

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

だから、私はこのように使用します

ng serve --Host 0.0.0.0 --disableHostCheck true

myHostName.com:42 :)への再接続

3
CookAtRice

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

ng serve --Host 0.0.0.0 --public-Host <workspace>-<username>.c9users.io
2
Ben Hanna

同じエラーが発生しました。以下のようなパブリックオプションは私のために問題を解決しました：

ng serve --Host 0.0.0.0 --port 8080 --live-reload-port 8081 --public $C9_HOSTNAME
1
LacOniC

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

ng serve --public --Host yourip --port yourportnumber

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

1
pa1 Raju

Angular.jsonで、architect-> serve-> optionsの下に以下を追加します

"disableHostCheck": true

これから回答を得ました Github Issue Page

0
ruwan800

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

ng serve --Host 192.168.1.42
0
MatiusDevelopment

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

--disableHostCheck trueをng serveコマンドに追加するという@tarnの提案（受け入れられた回答に対するコメントから）は、トリックを行いました。

0
Mark Meuer

問題は、-publicパラメーターで指定したリンクにのみアクセスできることです。私の場合、--publicで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

詳細については、 ここをクリック

0
shubham

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

パブリックフラグを使用します。例：ng serve --Host <workspace>-<username>.c9users.io --public

0
Jason Spick

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

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

"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"

ここで、npm startコマンドでangularを実行します。それでおしまい。

0
susheel