Angular Push notification error in service worker, Unexpected token P in JSON at position 0

user_9415181 0
Viewed 4468

I am trying to use push notification in a pwa, but it is failing to receive the notification.

On the client side I am receiving the following error 

Uncaught SyntaxError: Unexpected token P in JSON at position 0
at Driver.onPush (ngsw-worker.js:1967)
at ngsw-worker.js:1871

I add an image that includes the data that reaches the service worker

As you can see in the previous image, the data field is empty, however when I send it I am adding a text

To test the application I am releasing the notification with the following:

https://web-push-codelab.glitch.me/

I already appreciate any contribution.

angular-service-worker progressive-web-apps push-notification
2 Answers

If your payload is in any json format, like the one above, the error does not appear, but the notification is not shown in your client and no other error message is shown. You have to use a certain json format. One minimal working payload is:

{ "notification": {"title": "message title", "body": "message body"} }

I haven't found the exact and complete spec for this json, but here (search for "payload") you'll find a more complete example.

user_105472910

Make sure you are correctly sending the payload.

Everything is fine except ngsw-worker can't parse the payload.

If you are on windows, try this:

--payload="{\"hello\":\"world\"}"

And not this:

--payload='{"hello":"world"}'

Example (using webpush cli):

web-push send-notification --endpoint="https://fcm.googleapis.com/fcm/send/xxx:xxx" --key="xxxxxxxxxxxxx" --auth="xxxxxxxxxx" --payload="{\"hello\":\"world\"}" --vapid-subject="https://localhost:8000" --vapid-pubkey=xxxxxxxxxx --vapid-pvtkey=xxxxxxxx
user_54571130
Related