Web Push notification Payload data is getting null

Question

Hi I'm trying to implement web push notification for web i followed the following example,except the server part for which i'm using python script to connect to gcm/fcm and generating payload .i'm getting the push event but the event.data coming null .

from datetime import datetime
from pyfcm import FCMNotification
pushService = FCMNotification(api_key ='xxx'}
registrationId=""
messageTitle = "New update available"
messageBody ="some message"
dryRun = False
extraData = {}
extraData['title'] = "nknkn"

sw.js

self.addEventListener('push',function(e){

console.log('Push Message Recevied',e.data);
var title = 'Push message';
e.waitUntil(
    self.registration.showNotification(title, {
        body: 'The Message form data',
        icon: 'icon.jpg',
        tag: 'my-tag'
    }));
});

Answer 1

Both, Google Chrome and Mozilla Firefox currently support payload for push messages, see PushMessageData on MDN. But according to the Push API specification, any payload MUST be encrypted, otherwise a browser will discard it and return null (see 11.1.6):

If the push message could not be decrypted for any reason, or if it is not encrypted and contains any payload, discard the message and terminate this process. A push message may be empty if it contains no content, but otherwise push event must not be fired for a push message that was not successfully decrypted using the key pair associated with the push subscription.

Here is a good article from Google Developers, which explains it with more details: Web Push Payload Encryption. And original draft of the Message Encryption for Web Push.

I also can suggest you to look at the set of already implemented libraries for WebPush on different languages: web-push-libs. You can find there a lib written on Python too. And another lib on Java, which can send push messages with a payload to Chrome and Firefox: https://github.com/MartijnDwars/web-push.