HTTPS를 통해 각도 조절 서버 가져오기
다음은 아무 것도 하지 않는 것 같습니다.
ng serve --ssl true --ssl-key <key-path> --ssl-cert <cert-path>
인증서 및 키를 기본 ssl 디렉터리에 제공하여 생성해도 아무런 작업이 수행되지 않습니다.
▁like처럼 보입니다.ng server는 완히무있습다니고하시전▁the를 완전히 무시하는 것입니다.--ssl해서 매개변및계말합니다서해속수▁parameter▁saying다말▁and합▁keeps니서.NG Live Development Server is running on http://localhost:4200.
Angular CLI 6+
저는 제 프로젝트를 업데이트했기 때문에 이제 이 답변도 업데이트할 수 있다고 생각했습니다.
이제 angular.json 파일에 다음과 같이 키와 인증서의 경로를 입력합니다.
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"projects": {
"<PROJECT-NAME>": {
"architect": {
"serve: {
"options": {
"sslKey": "<relative path from angular.json>/server.key",
"sslCert": "<relative path from angular.json>/server.crt",
...
}, ...
}, ...
}, ...
}, ...
}, ...
}
그런 다음 다음을 실행할 수 있습니다.
ng serve --ssl
기본적으로 SSL을 사용하려면 sslKey 및 sslCert 바로 아래에 "ssl": true 옵션을 추가해야 합니다.
Angular.json 스키마는 Angular CLI 설명서에서 찾을 수 있습니다.
Angular CLI 1.0.0+에 대한 이전 답변입니다.
이제 Angular-CLI가 SSL 옵션과 함께 작동합니다.이미 언급했듯이 다음 명령과 함께 사용할 키와 인증서를 수동으로 선택할 수 있습니다.
ng serve --ssl --ssl-key <key-path> --ssl-cert <cert-path>
키의 기본 경로를 설정하고 싶다면 .angular-cli.json 파일로 이동하여 그에 따라 Defaults 섹션을 조정할 수 있습니다.
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"defaults": {
"serve": {
"sslKey": "<relative path from .angular-cli.json>/server.key",
"sslCert": "<relative path from .angular-cli.json>/server.crt",
...
}, ...
}, ...
}
그런 다음 다음을 실행할 수 있습니다.
ng serve --ssl
기본적으로 SSL을 사용하려면 sslKey 및 sslCert 바로 아래에 "ssl": true 옵션을 추가해야 합니다.
사용할 수 있습니다.
--ssl
또는
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "someapp:build",
"ssl": true
},
그러면 SSL 인증서가 자동으로 생성됩니다.
호스트에 대한 플래그를 하십시오. 그런 다 Chrome 로 컬 서 인 된 를 서 려 면 수 하 설 다 합 니 정 다 를 그 래 플 음 락 이 증 명 음 자 체 해 대 에 스 트 호chrome://flags/#allow-insecure-localhost
또한 신뢰할 수 있는 루트 인증서로 인증서를 가져와야 합니다.이 작업을 수행하려면 Chrome에서 맨 위에 있는 특정 오류를 클릭한 후 다음을 클릭합니다.
- 릭
certificate (invalid) - 다음을 클릭합니다.
Details - 릭
Copy to File... - 다음 마무리를 하고 어딘가로 내보냅니다.
- start-> run->
inetcpl.cpl - 딸깍하는 소리
Content - 딸깍하는 소리
Certificates - 딸깍하는 소리
Trusted Root Certication Authorities - 릭
Import단추를 채우다 - 인증서 가져오기
- 실행하기
ng serve --ssl
주의하세요, 콘서트는 한 달 동안만 진행됩니다.그 달 말에 당신은 해결책을 찾는 데 어려움을 겪을 것입니다. 하지만 저는 이미 이것을 겪었고 여기 해결책이 있습니다.
JFYI, Angular6에서 conf를 옵션(angular.json)에 넣어야 합니다.
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "app:build",
"ssl": true,
"sslKey": "path to .key",
"sslCert": "path to .crt"
},
...
}
▁add오▁if시십추를 추가하면 됩니다.--ssl
ng serve --ssl
완벽하게 작동하면 자동으로 인증서가 생성됩니다.크롬 브라우저에서 테스트됨."신뢰할 수 없는 연결"이라고 표시되지만 계속 진행하십시오.
이것이 도움이 되길 바랍니다.
npm install browser-sync --save-dev
그리고 나서.
ng serve --ssl true --ssl-key /node_modules/browser-sync/lib/server/certs/server.key --ssl-cert /node_modules/browser-sync/lib/server/certs/server.crt
빠르고 대담함) 방금 제 Angular cli 6.2.3 프로젝트에서 사용했습니다.
이 솔루션을 보완하기 위해 로컬 호스트에 대한 키 및 인증서를 생성하는 방법을 알고 싶다면 다음과 같은 훌륭한 단계별 기사를 참조하십시오.
고유한 인증서를 생성하고 MAC의 신뢰할 수 있는 키 체인에 추가하려는 경우
OpenSSL을 사용하여 모든 인증서를 생성합니다.
1단계: 루트 SSL 인증서
2단계: 루트 SSL 인증서 신뢰
3단계: 도메인 SSL 인증서
4단계: 새 SSL 인증서 사용
# Step 1: Root SSL certificate
openssl genrsa -des3 -out rootCA.key 2048
openssl req -x509 -new -nodes -key rootCA.key -sha256 -days 1024 -out rootCA.pem
# Step 2: Trust the root SSL certificate
새로 만든 루트 SSL 인증서를 사용하여 도메인 인증서 발급을 시작하기 전에 한 단계 더 수행해야 합니다.Mac에서 발급한 모든 개별 인증서도 신뢰할 수 있도록 루트 인증서를 신뢰하도록 해야 합니다.
Mac에서 Keychain Access(키체인 액세스)를 선택하고 시스템 키체인의 Certificates(인증서) 범주로 이동합니다.도착하면 File > Import Items를 사용하여 rootCA.pem을 가져옵니다.가져온 인증서를 두 번 누르고 "이 인증서를 사용할 때:" 드롭다운을 신뢰 섹션에서 항상 신뢰로 변경합니다.
지금까지 지침을 올바르게 따른 경우 인증서는 Keychain Access 내부에 이와 유사하게 표시되어야 합니다.
# Step 3: Domain SSL certificate
이제 루트 SSL 인증서를 사용하여 localhost에 위치한 로컬 개발 환경에 대한 인증서를 발급할 수 있습니다.
새 OpenSSL 구성 파일 server.csr.cnf를 생성하여 인증서를 만들 때 명령줄에 이러한 설정을 입력하는 대신 가져올 수 있습니다.
[req]
default_bits = 2048
prompt = no
default_md = sha256
distinguished_name = dn
[dn]
C=US
ST=RandomState
L=RandomCity
O=RandomOrganization
OU=RandomOrganizationUnit
emailAddress=hello@example.com
CN = localhost
X509 v3 인증서를 생성하려면 v3.ext 파일을 생성합니다.제목을 지정하는 방법에 주목하십시오.AltName 여기 있습니다.
authorityKeyIdentifier=keyid,issuer
basicConstraints=CA:FALSE
keyUsage = digitalSignature, nonRepudiation, keyEncipherment, dataEncipherment
subjectAltName = @alt_names
[alt_names]
DNS.1 = localhost
server.csr.cnf에 저장된 구성 설정을 사용하여 로컬 호스트에 대한 인증서 키를 생성합니다.이 키는 서버에 저장됩니다.열쇠.
openssl req -new -sha256 -nodes -out server.csr -newkey rsa:2048 -keyout server.key -config <( cat server.csr.cnf )
인증서 서명 요청은 이전에 로컬 호스트에 대한 도메인 인증서를 만들기 위해 만든 루트 SSL 인증서를 통해 발급됩니다.출력은 server.crt라는 인증서 파일입니다.
openssl x509 -req -in server.csr -CA rootCA.pem -CAkey rootCA.key -CAcreateserial -out server.crt -days 500 -sha256 -extfile v3.ext
# Step 4 Use your new SSL certificate
이제 HTTPS로 로컬 호스트를 보호할 준비가 되었습니다.서버를 이동합니다.키 및 server.crt 파일을 서버의 액세스 가능한 위치에 저장하고 서버를 시작할 때 포함합니다.
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "project-falcon:build",
"ssl": true,
"sslKey": "src/assets/sslcertificate/server.key",
"sslCert": "src/assets/sslcertificate/server.crt"
}
}
Google Chrome에서 캐시를 지우고 브라우저를 다시 시작하고, Mac에서 캐시 및 임시 파일도 삭제합니다.
이제 사용할 수 있습니다.ng serve -o
언급
맞습니다.현재 구현에서는 SSL 구성 옵션을 고려하지 않습니다.이 문제를 해결하는 풀 요청을 만들었습니다.그러나 이 문서를 작성할 때 마스터에 아직 병합되지 않았습니다.
Angular CLI 1.0.0+.
ng serve --ssl 1 --ssl-key {{key-path}} --ssl-cert {{cert-path}}
Angular CLI 6+
ng server --ssl true --sslKey {{key-path}} --sslCert {{cert-path}}
{{*-path}}의 값을 해당 값으로 변경합니다.
이 Angular에서 며칠을 보냈습니다. SSL을 통한 노드 API, 이 SO 게시물에서 제 솔루션을 볼 수 있습니다.
서버 팀에 인증서 및 포트를 제공하는 것이 좋습니다.서버 수준에서 구성합니다.이 방법은 항상 생산 코드에 적합합니다.
팀이 도메인과의 인증서 및 DNS 매핑을 구성합니다.
그래서 HTTPS://당신의 앱 도메인 이름: 당신이 선택한 포트/
언급URL : https://stackoverflow.com/questions/39210467/get-angular-cli-to-ng-serve-over-https
'programing' 카테고리의 다른 글
| 데이터 내보내기에서 MYSQL WORKBENCH 대 MARADB 문제 (0) | 2023.06.04 |
|---|---|
| UITableView 테이블에서 AutoLayout을 사용할 수 있습니까?머리글 보기? (0) | 2023.06.04 |
| WPF DataGrid 렌더링 속도가 매우 느림 (0) | 2023.06.04 |
| 다른 사람(iPhone) 내에서 앱 실행 (0) | 2023.06.04 |
| 철도에서 루비의 수집 경로와 회원 경로의 차이? (0) | 2023.06.04 |