Building and serving locally Angular with dotnet backend and supplying signed and trusted certificate.
Required tools: Link to heading
brew
angular-cli
mkcert
nss # for Firefox root-ca install
Using mkcert Link to heading
Install root-ca
mkcert -install
Add certificates to dotnet Link to heading
Create .pfx certificate Link to heading
In root folder of solution run: Link to heading
mkcert -pkcs12 -p12-file kestrel.pfx localhost
Ensure .pfx gets transferred to build folder Link to heading
.csproj
<ItemGroup Condition="'$(Configuration)' == 'Debug' ">
<None Update="kestrel.pfx">
<CopyToOutputDirectory Condition="Exists('kestrel.pfx')">PreserveNewest</CopyToOutputDirectory>
</None>
</ItemGroup>
Add settings for kestrel Link to heading
appsettings.Development.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
"Kestrel": { | |
"Certificates": { | |
"Default": { | |
"Path": "kestrel.pfx", | |
"Password": "changeit" | |
} | |
} | |
} |
Add certificates to Angular Link to heading
Create .pem certificate / key Link to heading
mkcert -cert-file ssl/localhost.pem -key-file ssl/localhost-key.pem localhost
Any of below should work Link to heading
1. Run ’ng serve’ with cli params, OR Link to heading
ng serve --ssl true --ssl-cert ../ssl/localhost.pem --ssl-key ./ssl/localhost-key.pem
2. Add to angular.json Link to heading
"serve": {
"options": {
"sslCert": "./ssl/localhost.pem",
"sslKey": "./ssl/localhost-key.pem",
"ssl": true
},