如何在局域网安装自制PWA？无需公网部署

前提准备 #

确保你的PWA项目满足基础要求：

• 存在合法的manifest.json，必须包含name、short_name、start_url、display（设为standalone或fullscreen）、icons（至少提供192x192和512x512尺寸的PNG图标）
• 已配置Service Worker（如sw.js）并在主页面完成注册，确保它能缓存所有必要资源（HTML、CSS、JS、图片等），这样安装后关闭主机仍可离线运行

方案1：无需HTTPS的HTTP局域网服务器（推荐新手） #

Chrome 72及以上版本允许局域网IP（如192.168.x.x、10.x.x.x）作为安全上下文，直接用HTTP即可触发PWA安装：

1. 打开电脑终端（Windows用命令提示符，Mac/Linux用终端），进入你的PWA项目根目录
2. 启动内置HTTP服务器：

   # Python 3
   python -m http.server 80
   # Python 2（若仍在使用）
   python -m SimpleHTTPServer 80
   

3. 找到你的电脑局域网IP：
   • Windows：运行ipconfig，查看「无线局域网适配器WLAN」下的IPv4地址
   • Mac/Linux：运行ifconfig或ip addr，找到WiFi对应的IP地址

方案2：HTTPS局域网服务器（兼容更旧版本浏览器） #

如果需要HTTPS环境，用自签证书快速搭建：

1. 进入项目根目录，生成自签证书（多数系统自带openssl）：

   openssl req -x509 -newkey rsa:4096 -keyout key.pem -out cert.pem -days 365 -nodes
   

   按提示填写信息，所有字段可直接回车跳过，仅需确保输入格式合法即可
2. 创建server.py脚本，内容如下：

   from http.server import HTTPServer, SimpleHTTPRequestHandler
   import ssl
   
   # 替换为你的局域网IP和端口
   local_ip = "192.168.1.100"
   port = 443
   
   server_address = ('0.0.0.0', port)
   httpd = HTTPServer(server_address, SimpleHTTPRequestHandler)
   httpd.socket = ssl.wrap_socket(
       httpd.socket,
       server_side=True,
       certfile='cert.pem',
       keyfile='key.pem',
       ssl_version=ssl.PROTOCOL_TLS
   )
   print(f"HTTPS server running at https://{local_ip}:{port}")
   httpd.serve_forever()
   

3. 运行脚本启动服务器：

   python server.py
   

Android端安装步骤 #

1. 确保手机和电脑连接同一个WiFi局域网
2. 打开Chrome浏览器，输入服务器地址（如http://192.168.1.100或https://192.168.1.100）
3. 若用HTTPS，会提示证书不安全，点击「高级」→「继续访问」（本地自签证书无安全风险）
4. 页面加载完成后，Chrome地址栏会出现安装图标（箭头/加号样式），点击后选择「安装」
5. 安装完成后，PWA会出现在手机应用列表，关闭电脑服务器后，仍可通过Service Worker缓存的资源正常运行

排障提示 #

• 若地址栏无安装按钮：打开Chrome开发者工具（F12）→「Application」标签，检查Manifest和Service Worker是否有报错，确保配置正确
• 若离线无法运行：确认Service Worker已正确缓存所有必要资源，可在开发者工具「Application」→「Cache Storage」中查看缓存内容

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