PWA + Capacitor.JS在Android中注册Service Worker失败求助

核心问题原因 #

当在Android模拟器中运行Capacitor打包的PWA时，Capacitor默认将Web资源作为本地文件加载，而非通过localhost的HTTP服务。你的Service Worker注册代码仍指向http://localhost/sw.js，导致模拟器无法找到该脚本文件，从而触发错误。

修复步骤 #

• 修改Service Worker注册路径
  找到注册Service Worker的代码，将绝对URL替换为相对路径：

  // 原错误写法
  navigator.serviceWorker.register('http://localhost/sw.js');
  // 修改为相对路径
  navigator.serviceWorker.register('./sw.js');
  

• 验证Capacitor配置
  检查capacitor.config.json的server配置，确保适配本地资源加载：

  {
    "server": {
      "androidScheme": "https",
      "cleartext": true // 若使用HTTP协议需开启此项
    }
  }
  

• 重新同步资源到Android项目
  执行命令更新模拟器中的资源：

  npx cap sync android
  npx cap open android
  

额外排查手段 #

• 确认sw.js文件已被正确复制到Android项目的app/src/main/assets/public目录下，Capacitor会自动同步Web资源到该目录，文件缺失会导致404错误。
• 通过Chrome DevTools（chrome://inspect）连接模拟器，查看Network面板中sw.js的请求状态，明确是路径错误还是权限问题。

内容的提问来源于stack exchange，提问作者JRRT