对于使用NX的带有Angular Micro前端的mac

步骤1：创建自签名根证书

openssl req -x509 -nodes -new -sha256 -days 390 -newkey rsa:2048 -keyout "RootCA.key" -out "RootCA.pem" -subj "/C=de/CN=localhost.local"
openssl x509 -outform pem -in "RootCA.pem" -out "RootCA.crt"

步骤2：定义应包含在证书中的域和子域

为此，只需创建一个名为vhosts_domains.ext的文本文件并插入以下内容：

authorityKeyIdentifier=keyid,issuer
basicConstraints=CA:FALSE
keyUsage = digitalSignature, nonRepudiation, keyEncipherment, dataEncipherment
subjectAltName = @alt_names
[alt_names]
DNS.1 = localhost
DNS.2 = *.mixable.blog.local
DNS.3 = mixable.blog.local

此示例包括域mixeble.blog.local的本地开发环境的子域以及所有子域，如www.mixable.blog.loal或apps.mixeble.blog.local。

步骤3：创建证书

openssl req -new -nodes -newkey rsa:2048 -keyout localhost.key -out localhost.csr -subj "/C=de/ST=State/L=City/O=Organization/CN=localhost.local"
openssl x509 -req -sha256 -days 1024 -in localhost.csr -CA RootCA.pem -CAkey RootCA.key -CAcreateserial -extfile vhosts_domains.ext -out localhost.crt

步骤4：使证书可用于Angular应用程序

nx serve host --open --devRemotes=<app names> --ssl --ssl-key <folder_location>/localhost.key --ssl-cert <folder_location>/localhost.crt

步骤5：将证书从导入添加到macOS密钥链

在chrome上，如果您仍然获得无效证书，则下载证书并添加到密钥链，并使所有证书都可信。

您确定站点的地址与证书相同吗？我对Chrome和自签名证书也有同样的问题，但最后我发现它对证书上域名的验证非常挑剔（应该如此）。

Chrome没有自己的证书存储，而是使用Windows自己的证书。然而，Chrome不提供将证书导入商店的方法，因此您应该通过IE添加证书。

在Google Chrome中安装证书

在Internet Explorer中安装证书

还可以看看这两种不同的创建自签名证书的方法（我假设您使用的是您没有提到的IIS）。

如何在IIS 7中创建自签名证书

下面是一个仅使用Java 8 keytool.exe而不是openssl的解决方案：

@echo off
set PWD=changeit
set DNSNAME=%COMPUTERNAME%

echo create ca key
keytool -genkeypair -alias ca -keystore test.jks -keyalg RSA -validity 3650 -ext bc:critical=ca:true -dname "CN=CA" -storepass:env PWD -keypass:env PWD
echo generate cert request for ca signing
keytool -certreq -keystore test.jks -storepass:env PWD -alias ca -file ca.csr -ext bc:critical=ca:true
echo generate signed cert
keytool -gencert -keystore test.jks -storepass:env PWD -alias ca -infile ca.csr -outfile ca.cer -validity 3650 -ext bc:critical=ca:true
echo CA created. Import ca.cer in windows and firefox' certificate store as "Trusted CA".
pause

echo create server cert key for %DNSNAME%
keytool -genkeypair -alias leaf -keystore test.jks -keyalg RSA -validity 3650 -ext bc=ca:false -ext san=dns:%DNSNAME%,dns:localhost,ip:127.0.0.1 -dname "CN=Leaf" -storepass:env PWD -keypass:env PWD
echo generate cert request
keytool -certreq -keystore test.jks -storepass:env PWD -alias leaf -file leaf.csr -ext bc=ca:false -ext san=dns:%DNSNAME%,dns:localhost,ip:127.0.0.1
echo generate signed cert
keytool -gencert -keystore test.jks -storepass:env PWD -alias ca -infile leaf.csr -outfile leaf.cer -validity 3650 -ext bc=ca:false -ext san=dns:%DNSNAME%,dns:localhost,ip:127.0.0.1

rem see content
rem keytool -printcert -file leaf.cer -storepass:env PWD 

echo install in orig keystore
keytool -importcert -keystore test.jks -storepass:env PWD -file leaf.cer -alias leaf

echo content of test.jks:
keytool -list -v -storepass:env PWD -keystore test.jks
pause

您也可以使用管道而不是文件，但是使用这些文件，如果出现问题，您可以检查中间结果。SSL在windows上通过IE11、Edge、FF54、Chrome60和Android上的Chrome60进行了测试。

请在使用脚本之前更改默认密码。

mkdir CA
openssl genrsa -aes256 -out CA/rootCA.key 4096
openssl req -x509 -new -nodes -key CA/rootCA.key -sha256 -days 1024 -out CA/rootCA.crt

openssl req -new -nodes -keyout example.com.key -out domain.csr -days 3650 -subj "/C=US/L=Some/O=Acme, Inc./CN=example.com"
openssl x509 -req -days 3650 -sha256 -in domain.csr -CA CA/rootCA.crt -CAkey CA/rootCA.key -CAcreateserial -out example.com.crt -extensions v3_ca -extfile <(
cat <<-EOF
[ v3_ca ]
subjectAltName = DNS:example.com
EOF
)

在Mac上，您可以使用Keychain Access实用程序将自签名证书添加到系统密钥链，然后Chrome将接受它。我在这里找到了分步说明：

Google Chrome、Mac OS X和自签名SSL证书

基本上：

双击带有X的锁定图标并将证书图标拖放到桌面，打开此文件（以.cer扩展名结尾）；这将打开允许您批准证书的密钥链应用程序。

这篇文章已经得到了大量的响应，但我基于其他一些答案创建了一个bash脚本，以便更容易生成在Chrome中有效的自签名TLS证书（在Chrome65.x中测试）。希望它对其他人有用。

自签名tls-bash脚本

安装（并信任）证书后，不要忘记重新启动Chrome(chrome://restart)

另一个值得一看的工具是CloudFlare的cfssl工具包：

cfssl