在 Service Worker (Firebase) 中设置变量 messagesSenderId

Question

我想在我的 service worker 中设置一个可变的 messagesSenderId 值，而不是一个硬编码的值。是否可以？

我像这样注册我的服务工作者：

navigator.serviceWorker.register( 'firebase-messaging-sw.js' )
.then( function( registration ) {
    messaging.useServiceWorker( registration );     
});

在我的 firebase-messaging-sw.js 中，我像这样初始化 firebase

importScripts('https://www.gstatic.com/firebasejs/3.9.0/firebase-app.js' );
importScripts('https://www.gstatic.com/firebasejs/3.9.0/firebase-messaging.js' );

firebase.initializeApp({
  'messagingSenderId': 'my-id' // <- I want this to be variable
});

问题是我找不到如何将数据传递给我的服务工作者文件。任何的想法？

谢谢

Answer 1

如前所述，在“安装”之前将状态信息传递给服务工作者回答了这个问题。谢谢。

以下是此用例的答案：

您需要在 URL 中传递变量，如下所示：

var myId = 'write-your-messaging-sender-id-here';
navigator.serviceWorker.register( 'firebase-messaging-sw.js?messagingSenderId=' + myId )
.then( function( registration ) {
    messaging.useServiceWorker( registration );     
});

然后，在 firebase service worker (firebase-messaging-sw.js) 中，你可以像这样获取这个变量：

importScripts('https://www.gstatic.com/firebasejs/3.9.0/firebase-app.js' );
importScripts('https://www.gstatic.com/firebasejs/3.9.0/firebase-messaging.js' );

var myId = new URL(location).searchParams.get('messagingSenderId');

firebase.initializeApp({
  'messagingSenderId': myId
});

这有效。但是 URL.searchParams 是一个非常新的工具。它的兼容性不如 Firebase 本身。

URL.searchParams：Chrome 51+，Firefox：52+，Opera：未知

Firebase：Chrome 50+、Firefox 44+、Opera 37+

所以而不是：

var myId = new URL(location).searchParams.get('messagingSenderId');

我建议使用：

var myId = get_sw_url_parameters( 'messagingSenderId' );

function get_sw_url_parameters( param ) {
    var vars = {};
    self.location.href.replace( self.location.hash, '' ).replace( 
        /[?&]+([^=&]+)=?([^&]*)?/gi, // regexp
        function( m, key, value ) { // callback
            vars[key] = value !== undefined ? value : '';
        }
    );
    if( param ) {
        return vars[param] ? vars[param] : null;    
    }
    return vars;
}