前言
如果你问任何一个Fiori开发者web上缺少哪些移动设备功能，推送通知总是排在首位。Web推送通知允许用户选择及时更新，从而更好地参与及时的新更新。
我们撰写本文的目的是让您理解（理论上）并在SAP UI5应用程序中实现（编码）推送通知。因此，我们的目标受众包括熟悉SAP UI5的解决方案架构师和应用程序开发人员。
为了更好地了解web推送的工作原理，建议您熟悉其背后的web技术，但解释这些web技术超出了本文的范围。因此，我们提供了外部资源的超链接，供您参考和将来阅读！
网页推送是一项可选功能，使网页应用程序能够接收从服务器推送给他们的消息，无论网页应用程序是否在前台，甚至当前加载在网页浏览器上。这使得开发人员能够向选择加入的用户提供异步通知和更新，国内大数据公司排名，从而更好地参与及时的新更新。
从技术上讲，W3C标准Web Push API提供了将实时事件（包括数据）从应用程序服务器（应用程序服务器）传递到客户端对等服务器（Web浏览器）的能力，没有任何来自用户的交互。
它是如何工作的？
Web应用程序可以安装一个服务工作者，一个具有有限功能集的后台网页，可以订阅推送服务。然后，应用程序服务器可以通过Web推送服务向浏览器发送推送消息，浏览器可以处理该消息并在屏幕上显示通知。
了解通知工作流
以下是推送通知涉及的三个代理，
在浏览器上运行的程序中面向用户的部分。它与浏览器交互以请求推送订阅，并接收订阅更新
生成订阅更新以通过推送服务器传递的后端服务
负责处理事件并将其传递给正确订阅服务器的服务器。每个浏览器供应商都有自己的推送服务器来处理订阅管理。例如，Mozilla Firefox使用autopush，Google Chrome使用FCM（以前称为GCM）
上图说明了这里解释的推送通知工作流的顺序：
是时候把手弄脏了
Google Chrome 52或更高版本/Mozilla Firefox 44.0或更高版本文本编辑器（Eclipse、SAP Web IDE等）具备HTML、CSS、JavaScript、SAP UI5和Chrome开发工具的基本知识下载此演示的源代码
对于此演示，我使用的是SAP Web IDE试用版，在这里我创建了一个SAP UI5应用程序。应用程序的源代码可以从上面的链接下载。当你运行应用程序时，你会看到这样的页面：
在你的应用程序目录中，注意你有一个名为软件js，这将是您的服务人员。我们将在后面的章节中研究该服务人员的功能部分。
我们的第一步是注册我们的服务人员。通过注册服务工作者，我们告诉浏览器我们的服务工作者文件在应用程序目录中的位置。该文件是一个JavaScript文件，浏览器将允许其访问服务工作者API。
此代码检查当前浏览器是否真正支持服务工作者和推送消息。如果它支持，那么它注册我们的软件js文件和服务工作者注册对象存储在swRegistration中。
虽然浏览器对服务工作者和推送消息的支持正在快速增长，但始终建议检查当前浏览器是否确实支持这些功能。
要使用此演示，您需要生成一些应用程序服务器密钥。您可以通过访问https://web-push-codelab.appspot.com或如果您熟悉Node JS，您可以使用web push命令行生成密钥，企业信息软件，方法如下：
请注意，您只需要为您的应用程序创建一次这些密钥，只需确保保留私钥即可私人。
这里我使用的是通过https://web-push-codelab.appspot.com
将您的公钥复制到控制器中/应用程序控制器.js正在替换appServerPublicKey属性。
最初，通知按钮被禁用，无法单击。在默认情况下禁用按钮是一个很好的做法，一旦您知道浏览器支持服务工作者和按钮，好淘客，就启用它。
现在让我们来看看控制器中的两个功能/应用程序控制器.js，一个名为initialiseUI的，用于检查用户当前是否已订阅，并调用updatePushBtn来启用按钮，并根据用户是否订阅来更改文本。
在本代码中，initialiseUI方法使用上一步的swRegistration，并在其pushManager上调用getSubscription方法。getSubscription方法返回一个与当前订阅（如果有）解析的承诺，否则将返回null。这样我们就可以检查用户是否已经订阅了。然后通过调用updatePushBtn方法，我们可以启用按钮，并使用一些有用的文本来启用它。
在这段代码中，函数只是根据用户是否订阅来更改文本，然后启用按钮。
最后一件事是在我们的服务人员注册时调用initialiseUI。
允许用户订阅，让我们在initialiseUI方法中为我们的按钮附加一个侦听器。
当用户单击按钮时，我们首先禁用按钮，以确保用户在订阅push时不能再次单击按钮，因为接收push服务器的响应可能需要一些时间。
