Question

我有一个很大的内部角度项目。我们有一些要求向用户发送有关工作中某些流程的通知。我将项目的前端更新为angular 8，我们使用Nodejs和Express作为后端。在大多数情况下，一切进展顺利。但是面临一个小挑战，即无法知道客户端是否已订阅。我知道他尚未订阅，我将显示一个用于取消订阅的按钮。所有订阅都保存在数据库中，但是某些客户端针对不同的浏览器获得了多个订阅。因此，有一种方法可以知道用户是否已从使用的浏览器中订阅。任何帮助表示赞赏。

Answer 1

您将需要一个唯一的ID，供每个用户参考，并且可以跟踪订阅并触发通知。

我建议您结合一些注意事项，并使其在浏览器与浏览器以及设备与设备之间保持唯一性。

使用此插件获取唯一的设备ID

device-uuid

使用它并找到浏览器名称

getBrowserName() {

// @ts-ignore
let isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
if (isOpera) return 'isOpera';
// Firefox 1.0+
// @ts-ignore
let isFirefox = typeof InstallTrigger !== 'undefined';
if (isFirefox) return 'isFirefox';

 // Safari 3.0+ "[object HTMLElementConstructor]"
// @ts-ignore
let isSafari = /constructor/i.test(window.HTMLElement) || (function (p) {
  return p.toString() === "[object SafariRemoteNotification]";
  // @ts-ignore
})(!window['safari'] || (typeof safari !== 'undefined' && safari.pushNotification));

if (isSafari) return 'isSafari';

// Internet Explorer 6-11
// @ts-ignore
let isIE = /*@cc_on!@*/false || !!document.documentMode;
if (isIE) return isIE;

 // Edge 20+
// @ts-ignore
let isEdge = !isIE && !!window.StyleMedia;
if (isEdge) return 'isEdge';

// Chrome 1 - 71
// @ts-ignore
let isChrome = !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime);
if (isChrome) return 'isChrome';

// Blink engine detection
// @ts-ignore
let isBlink = (isChrome || isOpera) && !!window.CSS;
if (isBlink) return 'isBlink';

}

现在使用UUID和登录用户ID来配置浏览器名称。使用唯一ID跟踪订阅，并向用户登录的所有浏览器和设备发送通知。

您需要考虑使用浏览器，因为在所有浏览器中，设备的uuid都是相同的。

const uniqueId = uuid + getBrowserName（）+ logedInUserId;

我想这应该对您有所帮助。

Angular Service工作人员，推送通知和订阅的用户

1 个答案: