本地开发环境针对浏览器SSL证书配置

IT老兵刘1990
1,053 阅读8分钟

环境配置

  • 谷歌浏览器

  • phpstudy

  • mkcert

常见问题

  • 访问本地开发虚拟域名报错“报错 NET::ERR_CERT_AUTHORITY_INVALID”

  • 谷歌浏览器识别为不安全域名证书

问题分析

这可能是由于以下几个原因导致的：

  1. 自签名证书: 网站使用了自签名证书，而不是由公共的证书颁发机构（CA）颁发的证书。大多数浏览器默认不信任自签名证书。

  2. 证书过期: 网站的证书已经过期，或者证书尚未生效。

  3. 不受信任的证书颁发机构: 如果使用的是不常见或不受信任的证书颁发机构颁发的证书，可能会导致浏览器出现此错误。

  4. 证书链问题: 证书链可能存在问题，其中一个中间证书可能已被撤销或过期。

要解决这个问题，您可以尝试以下几种方法：

  • 检查证书: 确保您的证书是由公共的、可信任的证书颁发机构颁发的，并且没有过期或被撤销。

  • 导入证书: 如果是自签名证书，您可以手动导入证书到浏览器的受信任证书存储中，这样浏览器就会信任该证书。

  • 更新证书: 如果证书过期或无效，联系网站管理员更新证书。

  • 检查证书链: 确保证书链中的所有证书都是有效的。

如果您不是网站管理员，建议谨慎处理这种错误，以避免访问不安全的网站。

解决步骤

环境配置安装

谷歌浏览器、phpstudy自行官网next next next install

mkcert 下安装

要在MAC本地开发环境中使用谷歌浏览器认可的证书，您可以按照以下步骤操作：

  1. 安装证书管理工具： 首先，您需要安装一个证书管理工具，比如 mkcert。mkcert 是一个用于生成本地开发环境信任的自签名证书的工具。

  2. 安装 mkcert： 下载并安装 mkcert 工具。您可以在 GitHub 上找到详细的安装说明。通常，可以使用以下命令安装 mkcert：

    brew install mkcert

3. 生成证书： 使用 mkcert 工具为您的本地开发域名生成证书。假设您的本地开发域名是 yourproject.test，您可以运行以下命令生成证书：

mkcert -install
mkcert yourproject.test

4. 安装证书： mkcert 会生成 yourproject.test.pem 和 yourproject.test-key.pem 两个证书文件。将这两个文件放置到您的项目中，并在本地开发环境中配置使用这些证书。

     5. 配置本地开发环境： 配置您的本地开发环境（比如 PHPStudy）以使用这些证书。将生成的证书配置到您的 Web 服务器（如 Apache、Nginx）中，并确保服务器使用这些证书来响应 HTTPS 请求。

      6. 信任证书： 最后，在您的计算机或浏览器中，导入 mkcert 生成的 rootCA.pem 证书，并将其设置为受信任的根证书。这样，您的浏览器就会信任由 mkcert 生成的自签名证书。

通过以上步骤，您就可以在本地开发环境中使用有效的、谷歌浏览器认可的证书了，从而模拟 HTTPS 环境进行开发和测试。

以下是在 Windows 上安装和配置 mkcert 的步骤：

安装 Chocolatey（可选）

如果您尚未安装 Chocolatey 包管理器，可以使用以下步骤进行安装：

  1. 打开 PowerShell 作为管理员。

  2. 运行以下命令以启用 PowerShell 脚本执行策略：

    Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityProtocol -bor 3072; iex ((New-Object System.Net.WebClient).DownloadString('chocolatey.org/install.ps1'))

安装 mkcert

安装 mkcert 可以使用 Chocolatey 或直接下载二进制文件：

使用 Chocolatey 安装

  1. 打开 PowerShell 作为管理员。

  2. 运行以下命令安装 mkcert：

    choco install mkcert

下载二进制文件安装

  1. 前往 mkcert GitHub Releases 页面 下载最新的 mkcert 发行版。
  2. 解压下载的 ZIP 文件，并将 mkcert.exe 和 rootCA.pem 复制到您的系统 PATH 中，或者将它们放在您喜欢的位置。

生成和安装证书

  1. 打开命令提示符或 PowerShell 作为管理员。

  2. 使用 mkcert 命令来生成您的本地开发域名的自签名证书。假设您的开发域名是 yourproject.test，运行以下命令：

    mkcert -install mkcert yourproject.test 

这将生成 yourproject.test.pem 和 yourproject.test-key.pem 两个证书文件。

配置本地开发环境

将生成的证书配置到您的本地开发环境中，比如配置 Web 服务器（如 Apache、Nginx）使用这些证书来响应 HTTPS 请求。

在浏览器中信任证书

最后，将 rootCA.pem 导入到您的浏览器的受信任根证书中，以便浏览器信任由 mkcert 生成的自签名证书。这样，您的浏览器就能够安全地访问使用这些证书配置的本地开发环境了。

通过这些步骤，您可以在 Windows 环境下安装和配置 mkcert，从而方便地为本地开发环境生成有效的自签名证书。

手动安装 mkcert

  1. 下载 mkcert 前往 mkcert GitHub Releases 页面 下载适用于 Windows 的最新版本的 mkcert.exe。

  2. 安装根证书

    • 在下载的 mkcert.exe 所在的文件夹中，按住 Shift 键并右击空白处，在菜单中选择“在此处打开 PowerShell 窗口”（或“在此处打开命令提示符”）。

    • 运行以下命令来安装根证书：

      .\mkcert.exe -install

  3. 生成证书

    • 继续在 PowerShell 窗口中运行以下命令，以生成您的自签名证书。假设您的开发域名是 yourproject.test，运行以下命令：

      .\mkcert.exe yourproject.test

    这将生成 yourproject.test.pem 和 yourproject.test-key.pem 两个证书文件。

配置本地开发环境

将生成的证书配置到您的本地开发环境中，比如配置 Web 服务器（如 Apache、Nginx）使用这些证书来响应 HTTPS 请求。

在浏览器中信任证书

最后，将 rootCA.pem 导入到您的浏览器的受信任根证书中，以便浏览器信任由 mkcert 生成的自签名证书。这样，您的浏览器就能够安全地访问使用这些证书配置的本地开发环境了。

通过这些步骤，您可以手动安装 mkcert 并生成有效的自签名证书，以便在 Windows 环境下进行本地开发。

在谷歌浏览器中操作信任证书需要将证书添加到浏览器的受信任根证书列表中。以下是在谷歌浏览器中信任证书的一般步骤：

添加根证书

  1. 打开 Chrome 设置

    • 打开谷歌浏览器，点击右上角的菜单图标（三个竖点）。
    • 从菜单中选择“设置”。

  2. 导航到证书管理

    • 在设置页面的底部，点击“高级”。
    • 在“隐私和安全性”部分，点击“管理证书”。

  3. 导入根证书

    • 在打开的证书管理对话框中，切换到“受信任的根证书颁发机构”选项卡。
    • 点击“导入”按钮，然后选择您的根证书文件（通常是 .pem 或 .crt 格式的文件）。
    • 点击“打开”或“确定”来导入证书。

确认信任

  1. 确认导入

    • 导入成功后，您应该会看到您的根证书列在受信任的根证书列表中。

  2. 重启浏览器

    • 为了使更改生效，可能需要重启谷歌浏览器。

测试证书

  1. 访问网站
    • 在您的本地开发环境中使用这些证书配置了 HTTPS 的网站，尝试在谷歌浏览器中访问。
    • 如果一切正常，您应该不会再看到证书错误或警告。

通过这些步骤，您可以在谷歌浏览器中操作信任证书，使浏览器可以信任您通过 mkcert 生成的自签名证书，从而在本地开发环境中实现 HTTPS 访问。

在 Windows 操作系统下，一些应用程序可能更喜欢使用 .crt 格式的证书而不是 .pem 格式的证书。您可以尝试使用以下步骤将生成的 .pem 格式证书转换为 .crt 格式：

将 PEM 格式证书转换为 CRT 格式

  1. 打开命令提示符

    • 打开命令提示符（CMD）或 PowerShell。

  2. 使用 OpenSSL 转换

    • 如果您已经安装了 OpenSSL，可以使用以下命令将 .pem 格式证书转换为 .crt 格式：

      openssl x509 -outform der -in certificate.pem -out certificate.crt

      其中 certificate.pem 是您的 .pem 格式证书文件的路径和名称，certificate.crt 是您要生成的 .crt 格式证书文件的路径和名称。

  3. 导入转换后的证书

    • 将生成的 .crt 格式证书导入到浏览器或其他应用程序中，然后尝试使用这个证书进行测试。

测试转换后的证书

  1. 访问网站
    • 使用转换后的 .crt 格式证书配置的网站，尝试在浏览器中访问。
    • 如果一切正常，您应该不会再看到证书错误或警告。

通过这些步骤，您可以尝试将生成的 .pem 格式证书转换为 .crt 格式，以便在 Windows 系统上更好地支持。

快乐结束☺

avatar
文章
阅读
粉丝