我太懂你这个困扰了——用Playwright测内部HTTPS应用时，自定义CA证书不被浏览器认可，虽然开ignoreHTTPSErrors能凑活，但相当于跳过了所有证书校验，总觉得不够严谨。下面我就针对Ubuntu（包括微软Playwright镜像的CI/CD场景），分浏览器给你讲怎么让它们真正信任你的自定义CA证书：

先明确前提 #

你已经拿到了自定义CA的证书文件（比如示例里的localhost.crt），接下来不同浏览器的处理方式不一样，因为它们的证书信任机制各有差异。

一、WebKit：直接用系统信任商店就行 #

你之前试过的方法对WebKit完全有效，因为WebKit会直接读取系统的CA存储：

1. 把证书复制到系统CA目录：

   sudo cp ./localhost.crt /usr/local/share/ca-certificates/
   

2. 更新系统证书缓存：

   sudo update-ca-certificates
   

做完这两步，WebKit就能信任你的服务器证书了，不用额外配置Playwright。

二、Chromium：两种方式任选 #

Chromium（包括Playwright自带的Chromium）不会自动读取系统CA，得手动指定，这里给你两种实用方法：

方法1：通过Playwright配置指定SPKI指纹

这种方法不用改系统文件，直接在配置里加参数就行，适合灵活调整的场景：
首先在你的playwright.config.ts里，给Chromium的启动参数加--ignore-certificate-errors-spki-list，值是证书的SPKI指纹。你可以写个小工具函数生成指纹：

import { defineConfig, devices } from '@playwright/test';
import { readFileSync } from 'fs';
import { createHash } from 'crypto';

// 生成证书的SPKI指纹
function getSPKIFingerprint(certPath: string) {
  const cert = readFileSync(certPath, 'utf8');
  // 去掉证书首尾的标记和空格
  const spki = cert
    .replace(/-----BEGIN CERTIFICATE-----/, '')
    .replace(/-----END CERTIFICATE-----/, '')
    .replace(/\s+/g, '');
  const spkiDer = Buffer.from(spki, 'base64');
  // 生成SHA256指纹并转base64
  return createHash('sha256').update(spkiDer).digest('base64');
}

export default defineConfig({
  use: {
    // 记得把之前开的ignoreHTTPSErrors删掉，不然会跳过校验
    // ignoreHTTPSErrors: true,
  },
  projects: [
    {
      name: 'chromium',
      use: {
        ...devices['Desktop Chrome'],
        launchOptions: {
          args: [`--ignore-certificate-errors-spki-list=${getSPKIFingerprint('./localhost.crt')}`]
        }
      },
    },
  ],
});

方法2：给Playwright的Chromium安装证书

如果你用的是微软的Playwright镜像，里面的Chromium是独立打包的，你可以把证书直接追加到它的CA证书文件里，适合固定环境的CI场景：

# 先确保Chromium已安装，然后找到它的CA文件路径，把证书追加进去
cat ./localhost.crt >> $(npx playwright chromium path)/certificates/cacerts.pem

这一步可以加到CI的前置脚本里，或者写进Dockerfile里，一劳永逸。

三、Firefox：配置自定义证书数据库 #

Firefox有自己独立的证书数据库，得手动导入证书并指定给Playwright：

1. 创建并导入证书数据库
   Playwright镜像里已经自带了certutil工具（如果是自己的Ubuntu环境，先装libnss3-tools），执行以下命令：

   # 创建证书数据库目录
   mkdir -p ./firefox-certs
   # 导入自定义CA证书到数据库
   certutil -d sql:./firefox-certs -A -t "C,," -n "自定义CA证书" -i ./localhost.crt
   

   这里参数解释下：

   • -d sql:./firefox-certs：指定数据库路径，sql是Firefox现在用的格式
   • -t "C,,"：标记这个证书是可信的CA（只用于验证服务器证书）
   • -n：给证书起个好记的名字，方便管理
   • -i：指定你的CA证书文件路径

2. 在Playwright配置里指定数据库
   把刚才创建的数据库路径加到Firefox的启动参数里：

   export default defineConfig({
     projects: [
       {
         name: 'firefox',
         use: {
           ...devices['Desktop Firefox'],
           launchOptions: {
             args: [`--certificate-db=${process.cwd()}/firefox-certs`]
           }
         },
       },
     ],
   });
   

CI/CD场景（微软Playwright镜像）优化建议 #

如果是在CI里用微软的Playwright镜像，最好把证书配置步骤写到Dockerfile里，避免每次跑测试都重复操作：

FROM mcr.microsoft.com/playwright:v1.40.0-jammy

# 复制自定义CA证书到镜像里
COPY localhost.crt /tmp/localhost.crt

# 给WebKit配置系统证书
RUN cp /tmp/localhost.crt /usr/local/share/ca-certificates/ && update-ca-certificates

# 给Chromium追加证书
RUN cat /tmp/localhost.crt >> $(npx playwright chromium path)/certificates/cacerts.pem

# 给Firefox创建证书数据库并导入
RUN mkdir -p /firefox-certs && certutil -d sql:/firefox-certs -A -t "C,," -n "自定义CA" -i /tmp/localhost.crt

# 设置环境变量，方便Playwright配置引用
ENV FIREFOX_CERT_DB=/firefox-certs

然后在Playwright配置里用这个环境变量：

launchOptions: {
  args: [`--certificate-db=${process.env.FIREFOX_CERT_DB}`]
}

最后别忘了：把之前配置里的ignoreHTTPSErrors删掉，这样才能验证证书是否真的被浏览器信任了哦！

备注：内容来源于stack exchange，提问作者mwopitz