How to Make FireFox recieve background push notification without loading page? - firefox

I am using FCM for web push notifications.
All worked fine until suddenly Firefox stopped delivering push notifications except the page is open in the browser.
If the page is loaded and not in focus, notifications come in. I console.log()'d the onBackgroundMessage payload and I can confirm that the service worker receives it. But if I close that tab and send a push notification, it does not receive it.
The same setup works on Chrome, Opera, and Edge just fine no errors. Is there something with firefox?
Firefox version: 88.0.1 (64-bit)
in my Service Worker I have:
messaging.onBackgroundMessage(function (payload) {
// Customize notification here
var action_label;
if('action_label' in payload.data){
action_label = payload.data.action_label;
} else{
action_label = "Details";
}
const notificationTitle = payload.data.title;
const notificationOptions = {
body: payload.data.body,
icon: payload.data.icon,
requireInteraction: true,
data: {
click_action: payload.data.click_action,
url:payload.data.click_action
},
actions: [
{
action: "open_url", title: action_label
}
]
};
self.registration.showNotification(notificationTitle, notificationOptions);
});

This had to do with Firefox quitting instead closing, obtainable in MacBooks.
Not a real technical issue.

Related

Svelte/Sveltekit and socket.io-client not working in dev (works in preview)

I'm trying to make socket.io-client work in a svelte front end app to talk to an existing API server that already uses socket.io. After a number of challenges, I managed to make this work but I can only get this to work with sveltekit's preview and not in dev mode. Wondered if someone with some knowledge of those could explain why or suggest what I need to do to get it connecting in dev?
svelte 3.34.0
sveltekit next-169
socket.io(-client) 4.2.0
basic code as follows, currently within a file $lib/db.js where I define a few stores that are pulled into the layout for general use..
import { io } from "socket.io-client";
import { browser } from '$app/env';
const initSocket = async () => {
console.log('creating socket...');
let socket = io('http://192.168.1.5:4000', { 'connect timeout': 5000 });
socket.on("connect", () => {
// always works in preview...
console.log('socket created with ID:', socket.id);
});
socket.on("connect_error", (error) => {
// permanently fired in dev...
console.error('Failed to connect', error);
});
socket.on("error", (error) => {
console.error('Error on socket', error);
});
socket.on("foo", data => {
// works in preview when server emits a message of type 'foo'..
console.log("FOO:", data);
});
};
if (browser) {
initSocket();
}
// stores setup and exports omitted..
with svelte-kit preview --host I see the socket creation log message with the socket ID and the same can be seen on the api server where it logs the same ID. The socket works and data is received as expected.
with svelte-kit dev --host however, the log message from socket.on("connect").. is never output and I just see an endless stream of error messages in the browser console from the socket.on("connect_error").. call..
Failed to connect Error: xhr poll error
at XHR.onError (transport.js:31)
at Request.<anonymous> (polling-xhr.js:93)
at Request.Emitter.emit (index.js:145)
at Request.onError (polling-xhr.js:242)
at polling-xhr.js:205
Importantly, there is no attempt to actually contact the server at all. The server never receives a connection request and wireshark/tcpdump confirm that no packet is ever transmitted to 192.168.1.5:4000
Obviously having to rebuild and re-run preview mode on each code change makes development pretty painful, does anyone have insight as to what the issue is here or suggestions on how to proceed?
I've had a similar problem, I solved it by adding this code to svelte.config.js:
const config = {
kit: {
vite: {
resolve: {
alias: {
"xmlhttprequest-ssl": "./node_modules/engine.io-client/lib/xmlhttprequest.js",
},
},
},
},
};
The solution was provided by this comment from the vite issues.

How to send push notification from azure to windows mobile cordova app

Hi i am using azure process to send the push notification to windows 10
above version hybrid app and i use the below code to send the notification
https://learn.microsoft.com/en-us/azure/app-service-mobile/app-service-
mobile-cordova-get-started-push
i got this document there
pushRegistration.on('registration', function (data) {
this method is not firing is there any process to register before to send
notification
You have to implement a registerForPushNotifications method an call it every time user opens the App:
var pushRegistration = null;
function registerForPushNotifications() {
pushRegistration = PushNotification.init({
android: { senderID: 'Your_Project_ID' },
ios: { alert: 'true', badge: 'true', sound: 'true' },
wns: {}
});
If pushRegistration.on is not called, maybe registration is not complete or there is some error.
Create a breakpoint or print some message in:
pushRegistration.on('error', handleError);
And take a look if it's something wrong.
Also, you can check if there is some missing configuration following the Notification Hubs Diagnosis guidelines: https://learn.microsoft.com/en-us/azure/notification-hubs/notification-hubs-push-notification-fixer

Debugging service workers of push notifications for firefox mobile?

I am using the 'Web push notificatoins API' to send notifications from my server to my website.
Long story short - the notifications are received and shown by all major browsers except firefox android (ios untested). I suspect the service worker file to be the culprit but have no idea how to debug see/log its errors / messages.
The service_worker.js :
self.addEventListener('push', function (event) {
if (!(self.Notification && self.Notification.permission === 'granted')) {
console.log('back) ;
return;
}
const sendNotification = body => {
const title = "BTC changed - coinvalue.me";
return self.registration.showNotification(title, {
body,
});
};
if (event.data) {
const message = event.data.text();
event.waitUntil(sendNotification(message));
}
});
Question: How to debug the results of this file? Firefox WebIDE doesn't show any console.log()
Edit : Firefox version 54.0.11 on android 4.2.1

No answer from registerForPushNotifications() on Appcelerator

I am trying to use push notifications on the iphone emulator, but I am not having any success, I am using the example code:
var deviceToken = null;
// Check if the device is running iOS 8 or later
if (Ti.Platform.name == "iPhone OS" && parseInt(Ti.Platform.version.split(".")[0]) >= 8) {
Ti.API.log("identificada versão 8");
// Wait for user settings to be registered before registering for push notifications
Ti.App.iOS.addEventListener('usernotificationsettings', function registerForPush() {
Ti.API.log("Notifications config set");
// Remove event listener once registered for push notifications
Ti.App.iOS.removeEventListener('usernotificationsettings', registerForPush);
Ti.Network.registerForPushNotifications({
types : [Ti.App.iOS.NOTIFICATION_TYPE_BADGE, Ti.App.iOS.NOTIFICATION_TYPE_ALERT, Ti.App.iOS.NOTIFICATION_TYPE_SOUND],
success: deviceTokenSuccess,
error: deviceTokenError,
callback: receivePush
});
});
// Register notification types to use
Ti.App.iOS.registerUserNotificationSettings({
types: [
Ti.App.iOS.USER_NOTIFICATION_TYPE_ALERT,
Ti.App.iOS.USER_NOTIFICATION_TYPE_SOUND,
Ti.App.iOS.USER_NOTIFICATION_TYPE_BADGE
]
});
}
// For iOS 7 and earlier
else {
Ti.Network.registerForPushNotifications({
// Specifies which notifications to receive
types: [
Ti.Network.NOTIFICATION_TYPE_BADGE,
Ti.Network.NOTIFICATION_TYPE_ALERT,
Ti.Network.NOTIFICATION_TYPE_SOUND
],
success: deviceTokenSuccess,
error: deviceTokenError,
callback: receivePush
});
}
// Process incoming push notifications
function receivePush(e) {
alert('Received push: ' + JSON.stringify(e));
}
// Save the device token for subsequent API calls
function deviceTokenSuccess(e) {
deviceToken = e.deviceToken;
subscribeToChannel();
}
function deviceTokenError(e) {
alert('Failed to register for push notifications! ' + e.error);
}
and none of the registerForPushNotifications() callbacks are being fired, the success, the error, or the callback are not being called, and I am having a hard time solving it, I searched a bit on the web, the solutions where:
to turn off the liveView, but it did not solve my problem,
testing on a real iphone didn't help;
Check all the pushnotifications configurations on the appcelerator dashboard, and everything was fine.
I still can't find a solution.
Push notification only works on device.Push Notifications iOS simulator
Configuring push services for iOS devices
As suggested by Jagu and Danny, there is no way to test the Push Notifications on simulator/emulator.
But also remember to turn off LIVE VIEW when you test it on physical device, otherwise you may not get device token.

Service worker causing CORS issues on Firefox

I'm using service worker for push notifications, following this article. Everything is working with Chrome but with Firefox (v.44.0.2) I have a weird issue.
On successful login to my app, I register the service worker which does nothing but waiting for push events; I see that is correctly registered (from some logging and from about:serviceworkers). Now, if I refresh the page (CTRL+R) all my POST have CORS issues (missing Access-Control-Allow-Origin header) due to this service worker and the user is redirected to login page; from here on all POSTs do not work for the same reason.
Conversely, if I login, unregister the service worker and then refresh, there are no problems at all. Any idea of what's going on? Again my service worker just handles push events, no caching no other processing done and it perfectly works on Chrome.
Here's my service worker code ( SOME_API_URL points to a real API which is not needed for testing purpose cause the issue happens after the service worker registers, no push events needed)
self.addEventListener('push', function(event) {
// Since there is no payload data with the first version
// of push messages, we'll grab some data from
// an API and use it to populate a notification
event.waitUntil(
fetch(SOME_API_URL).then(function(response) {
if (response.status !== 200) {
// Either show a message to the user explaining the error
// or enter a generic message and handle the
// onnotificationclick event to direct the user to a web page
console.log('Looks like there was a problem. Status Code: ' + response.status);
throw new Error();
}
// Examine the text in the response
return response.json().then(function(data) {
if (data.error || !data.notification) {
console.error('The API returned an error.', data.error);
throw new Error();
}
var title = data.notification.title;
var message = data.notification.message;
var icon = data.notification.icon;
var notificationTag = data.notification.tag;
return self.registration.showNotification(title, {
body: message,
icon: icon,
tag: notificationTag
});
});
}).catch(function(err) {
console.error('Unable to retrieve data', err);
var title = 'An error occurred';
var message = 'We were unable to get the information for this push message';
var notificationTag = 'notification-error';
return self.registration.showNotification(title, {
body: message,
tag: notificationTag
});
})
);
});
self.addEventListener('notificationclick', function(event) {
console.log('On notification click: ', event.notification.tag);
// Android doesn't close the notification when you click on it
// See: http://crbug.com/463146
event.notification.close();
// This looks to see if the current is already open and
// focuses if it is
event.waitUntil(
clients.matchAll({
type: 'window'
})
.then(function(clientList) {
for (var i = 0; i < clientList.length; i++) {
var client = clientList[i];
if (client.url == '/' && 'focus' in client)
return client.focus();
}
if (clients.openWindow) {
return clients.openWindow('/');
}
})
);
});
Firefox 44 has bug 1243453, which causes the Origin header of cross-origin requests to get dropped if the service worker doesn't listen for fetch events.
The bug has been fixed in Firefox 45, which will be released the week of March 8, 2016 (next week, as of the time of this writing). In the meantime, and for users who don't immediately upgrade to the latest Firefox release, you can work around the problem by adding this code to the service worker:
addEventListener('fetch', function(evt) {
evt.respondWith(fetch(evt.request));
});

Resources