I have successfully implement APNS using django-push-notifications. And I have found that this dependency is growing up and has a Web Push Notifications as well. I had tried followed up the given code, but unable to see a registation_id. I got
Uncaught (in promise) DOMException`
index.html?_ijt=f2lo8aqelnrfm7g1266vtapp67:1
I put chrome an argument to loadVersionBrowser() to avoid error
Uncaught TypeError: Cannot read property 'match' of undefined
Here is my current file
<html>
<script>
// Utils functions:
function urlBase64ToUint8Array (base64String) {
var padding = '='.repeat((4 - base64String.length % 4) % 4)
var base64 = (base64String + padding)
.replace(/\-/g, '+')
.replace(/_/g, '/')
var rawData = window.atob(base64)
var outputArray = new Uint8Array(rawData.length)
for (var i = 0; i < rawData.length; ++i) {
outputArray[i] = rawData.charCodeAt(i)
}
return outputArray;
}
function loadVersionBrowser (userAgent) {
var ua = userAgent, tem, M = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
if (/trident/i.test(M[1])) {
tem = /\brv[ :]+(\d+)/g.exec(ua) || [];
return {name: 'IE', version: (tem[1] || '')};
}
if (M[1] === 'Chrome') {
tem = ua.match(/\bOPR\/(\d+)/);
if (tem != null) {
return {name: 'Opera', version: tem[1]};
}
}
M = M[2] ? [M[1], M[2]] : [navigator.appName, navigator.appVersion, '-?'];
if ((tem = ua.match(/version\/(\d+)/i)) != null) {
M.splice(1, 1, tem[1]);
}
return {
name: M[0],
version: M[1]
};
};
var applicationServerKey = "BHZZKYSonkdaKjxjgw7DKYO45PmetHY7jprxWn4K4gfZSxUuvyQRe1LegYKoKJzv8qhi5HiIO4wjn6SP9Gg1ftk";
// In your ready listener
if ('serviceWorker' in navigator) {
// The service worker has to store in the root of the app
// http://stackoverflow.com/questions/29874068/navigator-serviceworker-is-never-ready
var browser = loadVersionBrowser('chrome');
navigator.serviceWorker.register('navigatorPush.service.js?version=1.0.0').then(function (reg) {
reg.pushManager.subscribe({
userVisibleOnly: true,
applicationServerKey: urlBase64ToUint8Array(applicationServerKey)
}).then(function (sub) {
var endpointParts = sub.endpoint.split('/');
var registration_id = endpointParts[endpointParts.length - 1];
var data = {
'browser': browser.name.toUpperCase(),
'p256dh': btoa(String.fromCharCode.apply(null, new Uint8Array(sub.getKey('p256dh')))),
'auth': btoa(String.fromCharCode.apply(null, new Uint8Array(sub.getKey('auth')))),
'name': 'XXXXX',
'registration_id': registration_id
};
console.log(data);
})
}).catch(function (err) {
console.log(':^(', err);
});
}
</script>
Hello
</html>
Questions:
1. Where am I wrong?
2. Is Web Push Notification Gateway make use of FCM by default?
This line:
is very strange. Consider transforming it into something like:
You can't use a variable in the same statement that declares it.
As for the second question, web push notifications will (I think) use firebase for chrome, and whatever other provider is relavent for other browsers. This is handled by the django-push-notifications module, you don't have to worry about it.