Laravel PWA Service Worker 添加问题答案

【问题标题】：Laravel PWA Service Worker adding problemLaravel PWA Service Worker 添加问题
【发布时间】：2019-06-14 15:25:20
【问题描述】：

我正在开发 laravel 渐进式 Web 应用程序。我在 app.js 中启动服务人员。我的服务人员文件位于 ./publicdirectoy 中。它的名字是service-worker.js。

但问题是当我在 localhost 中运行应用程序时，它会在控制台中显示以下错误。

"uncaught (in promise) DOMException: Failed to register a ServiceWorker: 该脚本的 MIME 类型不受支持 ('text/plain')。"

那么我该如何解决这个问题，请告诉我。在 app.js 中，我包含以下代码：

if ('serviceWorker' in navigator)
{
    window.addEventListener('load', function() {
                 navigator.serviceWorker.register('/service-worker.js');
    });
}

【问题讨论】：

标签： laravel vuejs2 service-worker progressive-web-apps

【解决方案1】：

如果您使用 nginx 为您的项目提供服务，则将其添加到服务器块，这可能会解决问题：

location ~ \.js {
     add_header  Content-Type    application/x-javascript;
}

否则，如果您使用的是 apache，请将其放入 httpd.conf（同时确保您有 mod_mime）：

AddType text/javascript .js

这可能会解决您的问题，通常如果您在服务器设置中不包含 mime 设置，您可能会遇到这些问题。我建议先检查您的服务器设置。

【讨论】：

其实问题出在 php artisan swoole:http server 上。在工匠服务器或网络服务器中工作正常
尝试使用宅基地盒子你会得到很好的环境你可以在laravel.com/docs/5.7/homestead阅读更多关于相同的信息

【解决方案2】：

检查您的网络请求，当您没有正确加载 service-worker.js 文件时会出现此错误。

确保您确实可以通过您请求的 URL 访问 service-worker.js 文件

【讨论】：

是的，我也可以看到它们。它已注册，我可以从 application/service-worker 看到它。通过点击它，我也可以看到它的代码。但问题出现在控制台上。服务工作者内部的另一件事代码也没有运行