Question

我正在开发一个使用node.js和angular js的Twilio Programmable Chat API的应用程序。我在twilio聊天实例中启用了push配置。我已经使用firebase密钥在twilio中创建了推送凭证。在此之后，我使用chatGrant和twilio凭证sid获取了twilio令牌。我已经包含了firebase.js文件并初始化了firebase。在此之后，我获得了用户的许可以显示通知。一切正常。但是当我试图让设备令牌注册chatclientinstance时，它就会失败。这是我的代码，用于初始化firebase并获得许可，

 var config = {
      apiKey: "my_key",
      authDomain: "example.firebaseapp.com",
      databaseURL: "https://example.firebaseio.com",
      projectId: "example",
      storageBucket: "example.appspot.com",
      messagingSenderId: "861813283864"
    };
    if (firebase) {
      firebase.initializeApp(config);
      console.log("firbase initialized.");
    }

    if (firebase && firebase.messaging()) {
      // requesting permission to use push notifications
      firebase.messaging().requestPermission().then(() => {
        // getting FCM token
        console.log("got permission for showing notification.");
        firebase.messaging().getToken().then((fcmToken) => {
          // continue with Step 7 here 
          console.log("got fcm token.",fcmToken);
          // ... 
          // ... 
        }).catch((err) => {
          // can't get token
          console.log("error in getting token for notification.",err);
        });
      }).catch((err) => {
        // can't request permission or permission hasn't been granted to the web app by the user
        console.log("error in getting permission for notification.",err);
      });
    } else {
      // no Firebase library imported or Firebase library wasn't correctly initialized
      console.log("no Firebase library imported or Firebase library wasn't correctly initialized");
    }

}

我在控制台中得到了这个，

firbase initialized.
got permission for showing notification.
The script has an unsupported MIME type ('text/html').
Failed to load resource: net::ERR_INSECURE_RESPONSE                 firebase-messaging-sw.js 
error in getting token for notification. 
e {code: "messaging/failed-serviceworker-registration", message: "Messaging: We are unable to register the default s…). (messaging/failed-serviceworker-registration).", browserErrorMessage: "Failed to register a ServiceWorker: The script has an unsupported MIME type ('text/html').", stack: "FirebaseError: Messaging: We are unable to registe…o/polyfills.bundle.js:3152:35)↵    at <anonymous>"}

我已经完成了所有事情，正如twilio docs在PUSH NOTIFICATIONS ON WEB

所说的那样

但是我没有在我的服务器中添加“firebase-messaging-sw.js”。是否需要添加此js文件或twilio会自动创建并初始化它？

请找到我的解决方案。提前谢谢。

Answer 1

我发现这也令人困惑，因为文档不能解释通知支持实际上做了什么。您包含的代码（来自他们的聊天SDK文档）仅执行两项基本操作：

client.setPushRegistrationId('fcm', fcmToken)确保浏览器已注册FCM服务并请求Twilio可编程聊天通知。
messaging.onMessage(function(payload{client.handlePushNotification(payload);});似乎做得很少 - 它只是让聊天客户端在FCM收到消息时发出一个事件。

不的作用是创建一个侦听通知的服务。丢失文件的位置。首先，在某处创建此文件firebase-messaging-sw.js。我使用了Firebase文档中的以下示例：

// firebase sample code snippets from https://firebase.google.com/docs/cloud-messaging/js/client
importScripts('https://www.gstatic.com/firebasejs/5.0.4/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/5.0.4/firebase-messaging.js');

// Initialize the Firebase app in the service worker by passing in the essagingSenderId.
console.log("Initializing service worker...");
firebase.initializeApp({
  messagingSenderId: "<FILL IN FROM YOUR FIREBASE CONFIG>"
});

// Retrieve an instance of Firebase Messaging so that it can handle background messages.
var messaging = firebase.messaging();

// Listen for push messages and create notifications
messaging.setBackgroundMessageHandler(function(payload) {
  console.log('[firebase-messaging-sw.js] Received background message ', payload);
  // Customize notification here
  var notificationTitle = "My Notification Title";
  var notificationOptions = {
    body: "My Notification Text"
  };

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

这是一个基本的服务工作者，它会侦听通知然后显示它们。

接下来，从错误消息中，您可能已经注意到FCM正在查找要从Web根目录提供的此文件。如果情况并非如此，请稍微调整您的Twilio代码，以便在指定的网址（来自https://stackoverflow.com/a/41701594/4006592）查找此服务工作人员：

var messaging = firebase.messaging();
if (messaging) {
  navigator.serviceWorker.register("<URL FOR firebase-messaging-sw.js>").then(function(registration) {
    messaging.useServiceWorker(registration);

    // requesting permission to use push notifications
    messaging.requestPermission().then(function() {
      ...
    });
  });
}

通过上述更改，您可以明确指定firebase-messaging-sw.js的位置，然后FCM / Twilio Chat将按预期工作。

可编程聊天的Twilio推送通知失败

1 个答案: