具有自签名证书链的 Angular 项目

问题描述

基本上，我想在我的 Angular 环境中添加一个自签名证书（包括具有自己的 CA 和中间证书的完整链）。该环境可通过 pcname.fritz.Box 访问。就是这个想法。

现在我创建了我的 own CA and intermediate certificates 和 server/client certificates。之后，我将 ca-chain-bundle.cert.pem 添加到我的 Windows 10 根 CA。

然后我将 server.cert.pem 和 server.key.pem 添加到我的 angular.json 并从 ng serve --host pcsname.fritz.Box --ssl 开始。

如果我用 Firefox 打开 URL https://pcname.fritz.Box:4200/，我会进入开发者控制台 MOZILLA_PKIX_ERROR_SELF_SIGNED_CERT 和 Chrome/Edge em> 我得到 NET::ERR_CERT_AUTHORITY_INVALID。

我错过了什么？我不想将其添加为例外。相反，它应该在本地显示为有效证书。

解决方法

有几个问题：

1. 我对服务器证书使用了错误的组合键。因此，浏览器向我显示了 CN=localhost 而不是 CN=pcname.fritz.box。
2. Firefox 需要更改一些 setting 以接受来自 Windows 证书存储区的证书。
3. Chrome 需要带有 a SAN 的证书！
4. 不知道是否有必要，但我已将所有证书（根 CA、中间证书和服务器）添加到我的 Windows 根 CA 存储中。