脚本资源位于重定向后面，这是不允许的答案

【问题标题】：The script resource is behind a redirect, which is disallowed脚本资源位于重定向后面，这是不允许的
【发布时间】：2017-09-05 09:32:21
【问题描述】：

我正在实现 firebase 消息传递，但在 chrome 中的控制台上出现错误。

脚本资源位于重定向后面，这是不允许的。 /firebase-messaging-sw.js 加载资源失败：net::ERR_UNSAFE_REDIRECT

文件 /firebase-messaging-sw.js 位于公共文件夹中，我正在使用像这样的 FCM 安装https://github.com/firebase/quickstart-js/tree/master/messaging

但授权链接是https://09029e3f.ngrok.io/admin/pt/settings/notifications之类的链接。但主网站位于 main.domain.com

【问题讨论】：

标签： javascript firebase firebase-cloud-messaging

【解决方案1】：

Firebase 答案及其工作

默认情况下，Service Worker 脚本 (firebase-messaging-sw.js) 应位于应用程序的绝对路径上。使用快速启动项目，位置将是http://localhost:5000/firebase-messaging-sw.js。

由于您使用不同的服务器来存储静态文件，因此服务工作者脚本的位置可能不同或不同。有了这个，我们需要更新 Service Worker 注册代码的实现，并从不同的位置调用 Service Worker 脚本。

找到 Service Worker 脚本的静态位置。就我而言，它是http://localhost:5000/sw/firebase-messaging.sw.js，因为我将服务工作者脚本位置移到了 sw 文件夹中。要验证它是否可以访问，请尝试在浏览器地址栏中输入 url，应该会显示 service worker 脚本代码。从 https://www.gstatic.com/firebasejs//firebase.js 本地下载 firebase.js 脚本，并在需要显示通知的网页上将其命名为 /firebase.js">。

更新 firebase-messaging.js 脚本。找到关键字 firebase-messaging-sw.js 和，然后添加路径作为前缀。就我而言，它是http://localhost:5000/sw/firebase-messaging-sw.js 和http://localhost:5000/sw/firebase-cloud-messaging-push-scope。

非常感谢火力基地

【讨论】：

解决了我的问题。就我而言，我下载了 firebase-messaging.js 和 firebase-messaging-sw.js.map。在两个文件中按 Ctrl + F 搜索 firebase-messaging-sw.js，然后更新我的 firebase-messaging-sw.js 文件所在的路径。

【解决方案2】：

您可以通过使用 Service Worker 手动加载 firebase-messaging-sw.js 来解决此问题。
假设您有 2 个文件：index.html 和 firebase-message-sw.js。它们位于同一位置。

1.在index.html 中，加载firebase.js 并初始化您的firebase 应用：

<script src="https://www.gstatic.com/firebasejs/4.3.1/firebase.js"></script>
<script>
  var var config = {
        apiKey: YOUR_API_KEY,
        messagingSenderId: YOUR_SENDER_ID
    };
    firebase.initializeApp(config);
    navigator.serviceWorker.register('/firebase-messaging-sw.js')
      .then(function (registration) {
          messaging = firebase.messaging();

         //request permission for Push Message.
          messaging.requestPermission().then(function () {
              console.log('grant');

              messaging.getToken().then(function (currentToken) {
                 console.log('current token', currentToken);
            });
          }).catch(function(error) {
               console.log('Push Message is disallowed');
          })
      })
</script>

2。实现firebase-messaing-sw.js

importScripts('https://www.gstatic.com/firebasejs/4.3.1/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/4.3.1/firebase-messaging.js');
var config = {
    messagingSenderId: YOUR_SENDER_ID
};
firebase.initializeApp(config);
const messaging = firebase.messaging();

messaging.setBackgroundMessageHandler(function (payload) {
    console.log('[firebase-messaging-sw.js] Received background message ', payload);
    // Customize notification here
    const notificationTitle = 'Background Message Title';
    const notificationOptions = {
        body: 'Background Message body.',
        icon: '/firebase-logo.png'
    };

    return self.registration.showNotification(notificationTitle,
        notificationOptions);
});

完成！

【讨论】：