Laravel 8 PWA在Apache服务器无法安装的问题求助

问题根源 #

部署到Apache子目录（/projectname）后，Web应用清单的start_url、Service Worker的注册路径和作用域未适配子目录结构，导致两者作用域不匹配，不符合PWA可安装要求。

具体解决步骤 #

1. 修正Web应用清单的路径配置 #

找到项目public目录下的manifest.json文件，修改start_url和scope字段以适配子目录路径：

{
  "name": "你的应用名称",
  "short_name": "应用简称",
  "start_url": "/projectname/",
  "scope": "/projectname/",
  "display": "standalone", // 必须设置为standalone/fullscreen/minimal-ui之一
  // 其他配置项...
}

注意：display字段必须符合PWA安装要求，否则也会影响安装按钮显示

2. 调整Service Worker的注册代码 #

找到注册Service Worker的前端脚本（通常在resources/js/app.js或专门的SW注册文件中），修改注册路径和作用域：

// 替换原注册代码为适配子目录的版本
navigator.serviceWorker.register('/projectname/sw.js', {
  scope: '/projectname/'
})

确保sw.js文件存放在项目的public目录下，保证Apache能直接访问该文件。

3. 检查Apache的重写配置 #

• 确认项目public/.htaccess文件的重写规则不会拦截Service Worker请求，默认Laravel的.htaccess配置如下（无需修改，除非自定义了规则）：

<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews -Indexes
    </IfModule>

    RewriteEngine On

    # Handle Authorization Header
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]

    # Redirect Trailing Slashes If Not A Folder...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} (.+)/$
    RewriteRule ^ %1 [L,R=301]

    # Send Requests To Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]
</IfModule>

• 确保XAMPP的Apache启用了mod_rewrite模块：打开XAMPP的Apache配置文件httpd.conf，取消LoadModule rewrite_module modules/mod_rewrite.so的注释。

4. 清除缓存并重新测试 #

1. 打开Chrome开发者工具（F12），切换到Application标签页
2. 依次点击Service Workers -> 点击当前注册的SW右侧的Unregister按钮
3. 点击Storage -> Clear site data，清除所有相关缓存
4. 刷新页面，重新用Lighthouse检测PWA状态，同时查看地址栏是否显示安装按钮

5. 验证Service Worker状态 #

在Chrome开发者工具的Application -> Service Workers中，确认：

• Service Worker已成功注册，状态为Activated
• 作用域显示为http://localhost/projectname/
• 无报错信息

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