Angular / cli 개발 서버 c9.io 실행시 "잘못된 호스트 헤더"


84

현재 명령 : ng serve --host --public $IP:$PORT

내 웹 사이트의 결과 :

잘못된 호스트 헤더


위와 동일합니다 ... 동일한 결과
— Olejs

답변:


103

--disable-host-check당신이 Cloud9에서 실행해야하는 경우 플래그는 잘 작동합니다.

다음 명령을 사용합니다.

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

작동하지만 사용 --disable-host-check하면 콘솔에 경고가 표시됩니다. 자세한 내용은 WARNING: Running a server with --disable-host-check is a security risk. See medium.com/webpack/… 을 참조하십시오.
— Krishnadas PC

1
이 옵션은 더 이상 사용할 수 없습니다
— edi


19

이 호 보기

다음 행 node_modules/webpack-dev-server/lib/Server.js(425 행)을 편집하고 다음으로 변경하십시오.

return true;

cloud9 IDE를 사용하고 다음을 실행 ng serve --port 8080 --host 0.0.0.0합니다.. 이제 잘 작동합니다.


27
add --disableHostCheck true ng serve --host 0.0.0.0 --port 8080 --disableHostCheck true
— tarn

3
node_modules / webpack-dev-server / lib / Server.js에서 다음 행을 변경하십시오. if (this.disableHostCheck) return true; true를 반환하도록 변경합니다.
— 케쉬 쉬얍

disableHostCheck의 잠재적 인 위험에 관한 이 Angular CLI GitHub 문제 를 참조하십시오 .
— jmq

Adetiloye의 대답은 훨씬 더
— 마태 복음 도루

3
실행ng serve --host 0.0.0.0 --disable-host-check
— Ubaid Azad

15

이것은 나를 위해 작동합니다.

ngrok http --host-header=rewrite PORT

예 :

ngrok http --host-header=rewrite 4200

OP에 필요한 대답은 아니지만 어쨌든 추가해 주셔서 감사합니다. 프로젝트 설정을 변경하지 않고 ngrok 터널링에 대해 작동합니다.
— LuizLoyola

13

제 경우에는 호스트 이름을 사용하여 / 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에 다시 연결 중 :)


1
이것은 나를 위해 작동합니다 .-- host 0.0.0.0 --disableHostCheck true. 당신에게 @CookAtRice 감사
— 인 Vinay 디야

11

다음을 실행해야합니다.

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

나를 위해 작동합니다.


ng serve --port 8080 --publicHost 0.0.0.0
— Nitin.

8

아래 명령을 사용하면 저에게 효과적입니다.

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

1
효과가있다. 그러나 온라인에서 '-공개'옵션에 대한 설명은 어디에서 찾을 수 있습니까? 난 단지 발견 '--public 호스트'옵션
— niaomingjian

8

angular.json에서 architect-> serve- > options 아래에 다음을 추가하십시오.

"disableHostCheck": true

이 Github 문제 페이지 에서 답을 얻었습니다.


1
이렇게하면 컴퓨터에서 로컬로 실행하는 문제가 해결된다는 점을 지적하고 싶습니다. 위의 OP 원래 질문에 따라 Cloud9에서 해결되는지 확실하지 않습니다.
— Tom Doe

당신이 모든에 그것을 사용하려는 경우 오른쪽 깨끗한 솔루션입니다 ng serve(그리고 아마도 당신은 개발하려는)
— jowey

6

bitnami 이미지가있는 AWS EC2 인스턴스에 각도 앱을 배포 한 후 동일한 오류가 발생했습니다. 그런 다음 아래 명령으로 내 앱을 시작했는데 제대로 작동했습니다.

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

6

Angular CLI의 경우 아래 명령을 사용하십시오. 6.0.7

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

4

아래 버전의 Angular 및 서버 Amazon에서 테스트되었습니다.

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

명령 옵션이 변경되었습니다 겨, 지금 사용하는 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 를 참조하십시오.

읽을만한 가치가있는 기사를 읽어보세요.


이것은 나를 위해 일했지만 브라우저에서 공용 호스트 용으로 사용 된 정확한 하위 도메인을 포함해야했습니다.ng serve --host 0.0.0.0 --public-host sub.myhost.com
— Cel

3

이것은 Mateusz Sawa 덕분에 YouTube 동영상 댓글 중 하나에서 실제로 해결되었습니다.

확인하려면 여기 로 이동 하세요 .

-package.json에서 호스트 지정이 더 이상 작동하지 않음-

비디오에 사용 된 명령을 사용할 필요가 없다는 점에 유의하기 만하면 다음 지침으로도 앱이 정기적 인 angular-cli개발을 통해 작동하도록 할 수 있습니다.

먼저 etc / 폴더 에서 호스트 를 찾아야 합니다.

cd ..Linux 시스템의 루트에 도달 할 때까지 콘솔에 입력 하고 ls나열된 항목을 항상 확인하십시오.

호스트 파일 이 표시되면 올바른 위치에있는 것보다 sudo vi hosts이를 사용 하여 편집하십시오.

모든 ip 주소 "0.0.0.0 yourworkspace-yourusername.c9users.io " 아래에 줄을 추가하십시오 (물론 따옴표없이 :-))

또한 package.json에서 "start"변경 : "ng serve -H yourworkspace-yourusername.c9users.io "

그런 다음 응용 프로그램 폴더로 이동하여 터미널에서 응용 프로그램을 시작하면됩니다. npm start

방금 확인했고 작동했습니다.


2

최신 버전의 Angular CLI와 함께 아래 명령을 사용하면 저에게 효과적입니다.

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

2

두 솔루션 아래에서 작동합니다. 명령 줄에서 :

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

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


1

같은 오류가 발생했습니다. 공개 옵션은 다음과 같이 나를 위해 문제를 해결했습니다.

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

1

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

이것은 나를 위해 작동합니다.



0

0.0.0.0을 192.168.1.42와 같은 로컬 IP 주소로 변경하면 작동합니다.

ng serve --host 192.168.1.42

0

문제는 --public 매개 변수에 지정한 링크에만 액세스 할 수 있다는 것입니다. 제 경우에는 --public에 IP 주소를 제공하고 해당 IP에 대해 등록한 도메인으로 액세스를 시도했습니다. 그러나 ng는 --public에 제공된 유일한 호스트에 대해 바인딩합니다.

이 문제를 해결하기 위해 매개 변수를 하나 더 제공 disable-host-check했습니다.. 완전한 명령 :ng serve --disable-host-check --host 0.0.0.0 --port 3100 --public x.x.x.x

자세한 내용은 여기를 클릭하십시오.


0

localtunnel유틸리티를 사용하여 앱에 액세스하려고 할 때이 오류가 발생했습니다 .

추가 (허용 대답에 코멘트에서) @tarn의 제안을 --disableHostCheck true받는 ng serve명령은 트릭을했다.


0

누군가가 여전히 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"

이제 npm start명령으로 각도를 실행하십시오. 그게 다야.


0

모든 해결 방법에 감사드립니다 .-- disable-host-check가 저에게 효과적이지만 그 해결 방법을 사용해야하는 이유를 이해하지 못합니다. 왜 다른 새로운 응용 프로그램처럼 사용할 수 없습니다.


-1

이 기회를 줘

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

-3

"node_modules / webpack-dev-server / lib / Server.js"파일의 425 행을 false에서 true로 변경하십시오. 즉,

이전 : false를 반환합니다.

업데이트 됨 : true를 반환합니다.


설명을 더 추가하십시오.
— Mathews Sunny

당신은 감동 노드 업체 안
— 파블로 W.
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.