在 chrome 扩展中显示通知

Posted

技术标签:

【中文标题】在 chrome 扩展中显示通知【英文标题】:show notifications in chrome extension 【发布时间】:2014-09-17 21:23:39 【问题描述】:

我正在编写我的第一个 chrome 扩展程序。在我的 chrome 扩展中,我在右键单击上下文菜单中添加了一个选项。

chrome.contextMenus.create(
  "id": "MyExntesion",
  "title": "My Extension",
  "type": "normal",
  "contexts": ["image"],
  "onclick": this.handleClick
);

在我的 handleClick 方法中,我想显示一个通知。此通知应在浏览器窗口的右上角弹出,它只是确认用户已单击上下文菜单。我该怎么做?

我做了一些研究,但没有发现任何有用的东西。 https://developer.chrome.com/extensions/notifications 这是关于系统托盘通知的,而 https://developer.chrome.com/extensions/browserAction#method-setPopup 允许您创建新的弹出窗口,但它们仅在单击扩展图标时显示。

【问题讨论】:

【参考方案1】:

在 Chrome 中显示通知的主要方式有 3 种。

1) 上述chrome.notifications API。它将显示祝酒词(不仅仅是系统托盘中的指示),但作为开发人员,您对它的显示方式几乎没有发言权。使用概览here。

2) 标准 html Notification API。在 Chrome 中,看起来类似于 chrome.notifications,除了对格式的控制较少并且不受 Chrome 的通知中心管理。使用概览here。

3) 如果您真的想控制它的显示方式,最具侵入性和困难的方法是使用内容脚本将您的 UI 注入所有页面。

如果你这样做,你会面临几个问题:

一般来说,自己设计 UI 比较困难; UI 将仅限于网页视口; CSS 可能会从页面中溢出并破坏您的 UI(尽管 Shadow DOM 可以作为解决方案); 您需要“所有网页上的数据”的全面权限才能显示您的 UI。它往往会吓跑用户。

如果您仍然决定走那条路,这里有一个问题可能会有所帮助:Chrome extension content scripts custom ui

【讨论】:

我不知道你是否使用过evernote网络剪辑器扩展,但是那个扩展中显示的那些通知是使用你建议的第三个选项构建的吗? 但是,如果您使用选项 1 或 2(我正在尝试使用数字 2),您如何获取 registration_id 以便将推送通知发送到 chrome 浏览器?你如何等待通知?谢谢你的回答! @eloibm 显示通知与接收它们完全无关。沉思chrome.gcm 和链接的文档。如果仍有疑问,请提出新问题——不要在 cmets 中提出无关的后续问题,这不是 cmets 的目的。

以上是关于在 chrome 扩展中显示通知的主要内容,如果未能解决你的问题,请参考以下文章

获取Chrome扩展程序中日历事件的推送通知

如何在 chrome 扩展程序中获取选项卡通知,以便扩展程序可以在每次新通知到达时显示桌面警报

在 Chrome 扩展中使用 NOTY JS 通知库

如何创建通知 chrome 扩展?

chrome扩展通知中的Json文件内容[关闭]

使用 chrome 扩展记录/捕获推送通知