Angular Firebase 服务工作者部署在文件夹中答案

【问题标题】：Angular Firebase service worker deploy in folderAngular Firebase 服务工作者部署在文件夹中
【发布时间】：2019-07-05 21:12:30
【问题描述】：

我使用 Firebase 向我的 Angular 应用发送推送通知。

我按照本教程进行操作：

https://medium.com/@a.adendrata/push-notifications-with-angular-6-firebase-cloud-massaging-dbfb5fbc0eeb

当我在 localhost 中尝试时一切正常。

问题是当我部署它时，因为我是在一个文件夹中进行的，但服务工作者仍在根目录中搜索，然后找不到。

我使用这个命令进行部署：

ng build --prod --base-href /myfolder/

然后Service Worker就在：

https://mydomian.com/myfolder/firebase-messaging-sw.js

但应用仍然在搜索它

https://mydomian.com/firebase-messaging-sw.js

如何在我的文件夹中搜索？

我在这里看到了一些类似的问题：

https://groups.google.com/forum/?hl=es-419#!searchin/firebase-talk/firebase$20deploy$20in$20folder|sort:date/firebase-talk/1QKGP1lYj_A/k9hjXolECAAJ

但我没有这个 firebase.json...我想是因为它是一个 Angular 应用程序。

希望有人可以帮助我。

提前致谢

【问题讨论】：

你找到解决办法了吗？

标签： javascript angular firebase

【解决方案1】：

我有一个类似的问题，我通过在构建应用程序后，在一个名称类似于“4.a514e2ef0845553d68e7.js”的文件中搜索此代码来解决它

navigator.serviceWorker.register("/firebase-messaging-sw.js", {scope: "/firebase-cloud-messaging-push-scope"})

带绝对路径

换成

navigator.serviceWorker.register ("firebase-messaging-sw.js", {scope: "firebase-cloud-messaging-push-scope"})

【讨论】：

非常感谢@Juan Medina，它的工作原理......但我希望有人能告诉我们如何在不手动更改的情况下部署它？
任何不改变绝对路径的解决方案？

【解决方案2】：

创建了临时脚本。 (替换文件.js)

在构建 angular prod 文件时：

ng build --prod && node ./replacefile.js

const replace = require('replace-in-file');
const options = {
  files: 'dist/enlink/*.js',
  from: "register(\"/firebase-messaging-sw.js\",{scope:\"/firebase-cloud-messaging-push-scope\"})",
  to: "register(\"firebase-messaging-sw.js\",{scope:\"firebase-cloud-messaging-push-scope\"})",
  allowEmptyPaths: false,
};

try {
  replace.sync(options);
  console.log('Firebase service worker path fixed!');
} catch (error) {
  console.error('Error occurred:', error);
}

替换路径 '/' -> '' 会起作用。

【讨论】：