service worker注册报securityerror，主因是https未配置：localhost虽被豁免，但自定义域名（如dev.example.com）必须配可信https证书；推荐用mkcert生成并配置开发服务器，同时确保register()在dom就绪后执行、路径为根相对路径。
本地开发时 Service Worker 报 SecurityError: Failed to register a ServiceWorker，基本就是 HTTPS 环境没配对。localhost 默认被浏览器豁免，但一旦你用了自定义域名（如 dev.example.com）、启用了严格模式、或测试 PWA 安装流程，就绕不开 HTTPS。下面几招能真正解决问题，不是临时凑合。
用 mkcert 快速生成可信本地 HTTPS 证书
别再手写 openssl 命令——mkcert 是目前最省心的方案，生成的证书会被 Chrome、Firefox、Safari 直接信任。
- 安装 mkcert：macOS 执行
brew install mkcert nss；Windows 用 Chocolatey：choco install mkcert - 初始化本地 CA：
mkcert -install（需管理员/root 权限） - 为你的开发域名生成证书：
mkcert dev.example.com localhost 127.0.0.1→ 输出dev.example.com-key.pem和dev.example.com.pem - 把这两个文件放进项目目录（如
/cert/），后续配置开发服务器时引用
配置开发服务器启用 HTTPS 并绑定自定义域名
光有证书还不够，服务器得用它启动，并且让浏览器能通过域名访问。
-
改 hosts 文件：添加一行
127.0.0.1 dev.example.com（Windows 在C:\Windows\System32\drivers\etc\hosts，Mac/Linux 在/etc/hosts） -
Vite 示例：
import { defineConfig } from 'vite'
import fs from 'fs'
export default defineConfig({
server: {
host: 'dev.example.com',
port: 8080,
https: {
key: fs.readFileSync('./cert/dev.example.com-key.pem'),
cert: fs.readFileSync('./cert/dev.example.com.pem')
}
}
}) -
Webpack DevServer 示例：在
devServer中加https: true和key/cert字段，同时设host: 'dev.example.com'和allowedHosts: ['.example.com']
确保 Service Worker 注册逻辑不出错
HTTPS 配好了，注册仍失败？大概率是脚本执行时机或路径问题。
- 注册代码必须放在
<script></script>标签中，且在
