Fix the JS error "EventSource is not defined" caused by some non-standard browsers (#20584)
* fall back to periodic poller Co-authored-by: silverwind <me@silverwind.io>
This commit is contained in:
parent
99fc419855
commit
96440e6ada
3 changed files with 71 additions and 64 deletions
|
@ -28,14 +28,10 @@ async function receiveUpdateCount(event) {
|
|||
try {
|
||||
const data = JSON.parse(event.data);
|
||||
|
||||
const notificationCount = document.querySelector('.notification_count');
|
||||
if (data.Count > 0) {
|
||||
notificationCount.classList.remove('hidden');
|
||||
} else {
|
||||
notificationCount.classList.add('hidden');
|
||||
for (const count of document.querySelectorAll('.notification_count')) {
|
||||
count.classList.toggle('hidden', data.Count === 0);
|
||||
count.textContent = `${data.Count}`;
|
||||
}
|
||||
|
||||
notificationCount.textContent = `${data.Count}`;
|
||||
await updateNotificationTable();
|
||||
} catch (error) {
|
||||
console.error(error, event);
|
||||
|
@ -49,14 +45,24 @@ export function initNotificationCount() {
|
|||
return;
|
||||
}
|
||||
|
||||
if (notificationSettings.EventSourceUpdateTime > 0 && !!window.EventSource && window.SharedWorker) {
|
||||
let usingPeriodicPoller = false;
|
||||
const startPeriodicPoller = (timeout, lastCount) => {
|
||||
if (timeout <= 0 || !Number.isFinite(timeout)) return;
|
||||
usingPeriodicPoller = true;
|
||||
lastCount = lastCount ?? notificationCount.text();
|
||||
setTimeout(async () => {
|
||||
await updateNotificationCountWithCallback(startPeriodicPoller, timeout, lastCount);
|
||||
}, timeout);
|
||||
};
|
||||
|
||||
if (notificationSettings.EventSourceUpdateTime > 0 && window.EventSource && window.SharedWorker) {
|
||||
// Try to connect to the event source via the shared worker first
|
||||
const worker = new SharedWorker(`${__webpack_public_path__}js/eventsource.sharedworker.js`, 'notification-worker');
|
||||
worker.addEventListener('error', (event) => {
|
||||
console.error(event);
|
||||
console.error('worker error', event);
|
||||
});
|
||||
worker.port.addEventListener('messageerror', () => {
|
||||
console.error('Unable to deserialize message');
|
||||
console.error('unable to deserialize message');
|
||||
});
|
||||
worker.port.postMessage({
|
||||
type: 'start',
|
||||
|
@ -64,13 +70,16 @@ export function initNotificationCount() {
|
|||
});
|
||||
worker.port.addEventListener('message', (event) => {
|
||||
if (!event.data || !event.data.type) {
|
||||
console.error(event);
|
||||
console.error('unknown worker message event', event);
|
||||
return;
|
||||
}
|
||||
if (event.data.type === 'notification-count') {
|
||||
const _promise = receiveUpdateCount(event.data);
|
||||
} else if (event.data.type === 'no-event-source') {
|
||||
// browser doesn't support EventSource, falling back to periodic poller
|
||||
if (!usingPeriodicPoller) startPeriodicPoller(notificationSettings.MinTimeout);
|
||||
} else if (event.data.type === 'error') {
|
||||
console.error(event.data);
|
||||
console.error('worker port event error', event.data);
|
||||
} else if (event.data.type === 'logout') {
|
||||
if (event.data.data !== 'here') {
|
||||
return;
|
||||
|
@ -88,7 +97,7 @@ export function initNotificationCount() {
|
|||
}
|
||||
});
|
||||
worker.port.addEventListener('error', (e) => {
|
||||
console.error(e);
|
||||
console.error('worker port error', e);
|
||||
});
|
||||
worker.port.start();
|
||||
window.addEventListener('beforeunload', () => {
|
||||
|
@ -101,17 +110,7 @@ export function initNotificationCount() {
|
|||
return;
|
||||
}
|
||||
|
||||
if (notificationSettings.MinTimeout <= 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
const fn = (timeout, lastCount) => {
|
||||
setTimeout(() => {
|
||||
const _promise = updateNotificationCountWithCallback(fn, timeout, lastCount);
|
||||
}, timeout);
|
||||
};
|
||||
|
||||
fn(notificationSettings.MinTimeout, notificationCount.text());
|
||||
startPeriodicPoller(notificationSettings.MinTimeout);
|
||||
}
|
||||
|
||||
async function updateNotificationCountWithCallback(callback, timeout, lastCount) {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue