---
# System prepended metadata

title: Something about Notification
tags: [Notification, Chrome, Eletron]

---

---
title: 'Something about Notification'
disqus: hackmd
---

Notification
===

[TOC]

## Web-Push

[Chrome] 訂閱通知 

Service Worker可參閱 [google文件](https://developers.google.com/web/fundamentals/push-notifications/how-push-works)，Edge也直接把Service Worker當成開發工具的一個項目。

正常流程會與你的瀏覽器取得一個生成的TOKEN和chrome的endpoint, 只要TOKEN還沒換大概就記錄你的瀏覽器了。因此訪間也有訂閱管理的服務，定期接收訂閱內容通知。(進階:[PWA](https://ithelp.ithome.com.tw/articles/10196736))


![](https://i.imgur.com/TzchPCy.png)



Alert
---
注意最右邊的TAB有個藍點

![注意最右邊的TAB有個藍點](https://i.imgur.com/XIAbPZz.png)

以下為大家熟悉的ALERT 視窗

![](https://i.imgur.com/8B4R6W2.png)


Window Frame Flash
---

1. Window.getAttention(); [see MDN Doc](https://developer.mozilla.org/en-US/docs/Web/API/Window/getAttention)
不適用於任何瀏覽器
2. IE 的版本有 window.external.msSiteModeActivate();
可以做到如下的效果
![](https://i.imgur.com/osUzDHT.jpg)

但為了這個效果讓全部的東西都用舊版的東西...後面付出的代價應該很恐怖...

3. **真正適合的方法:**
   舉例: 用類似[ElectronJS](https://www.electronjs.org/)做出自己的安裝檔及執行,就可以直接控制(我有做一個小範例)。例如SLACK, LINE...等的。包含Airsupport Agent 都應該是這樣做的。
   
Chorme Extension
---
能做到在Chrome上的通知和互動，但也無法達成Window Frame Flash。
Extension是很棒很方便的東西，但要很小心資訊的部分。
就有人曾利用Extension把個資傳出去了。


###### tags: `Notification` `Eletron` `Chrome`
