JavaScript – 使用Google云消息和服务工作人员的桌面推送通知

前端之家收集整理的这篇文章主要介绍了JavaScript – 使用Google云消息和服务工作人员的桌面推送通知前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想使用Google云消息传送推送通知给我所有的桌面用户

我已经成功完成了以下步骤

>在服务人员初始化
>在Google Developers Console上创建一个项目
>添加了一个清单
>使用PHP CURL发送

这是我的CURL命令

$url = 'https://android.googleapis.com/gcm/send';
$msg="hi";
$data = array('title'=> $msg,'message'=>'Hello');
$regids= // added regids;
$fields = array('to' => $regids,'data' => $data);
$headers = array( 'Authorization: My auth key','Content-Type: application/json');

$ch = curl_init();

curl_setopt($ch,CURLOPT_URL,$url);
curl_setopt($ch,CURLOPT_POST,true);
curl_setopt($ch,CURLOPT_HTTPHEADER,$headers);
curl_setopt($ch,CURLOPT_RETURNTRANSFER,CURLOPT_SSL_VERIFYPEER,false);
curl_setopt($ch,CURLOPT_POSTFIELDS,json_encode($fields));

print_r(json_encode($fields));
$result=curl_exec($ch);
echo $result; 
if($result==FALSE)
{
    die('Curl Failed');
}
curl_close($ch);

一切正常,我可以使用以下代码显示默认通知

self.addEventListener('push',function(event) {
  console.log('Push message',event);
  var title = 'Push message';
  event.waitUntil(
    self.registration.showNotification(title,{
      body: 'The Message',icon: 'images/icon.png',tag: 'my-tag'
    }));
});

但是我需要的是显示通过CURL命令发送的通知消息(在应用程序中我们可以轻松地做到这一点)

我收到以下代码来接收推送通知(google)

self.addEventListener('push',function(event) {  
  // Since there is no payload data with the first version  
  // of push messages,we'll grab some data from  
  // an API and use it to populate a notification  
  event.waitUntil(  
    fetch(SOME_API_ENDPOINT).then(function(response) {  
      if (response.status !== 200) {  
        // Either show a message to the user explaining the error  
        // or enter a generic message and handle the
        // onnotificationclick event to direct the user to a web page  
        console.log('Looks like there was a problem. Status Code: ' + response.status);  
        throw new Error();  
      }

      // Examine the text in the response  
      return response.json().then(function(data) {  
        if (data.error || !data.notification) {  
          console.error('The API returned an error.',data.error);  
          throw new Error();  
        }  

        var title = data.notification.title;  
        var message = data.notification.message;  
        var icon = data.notification.icon;  
        var notificationTag = data.notification.tag;

        return self.registration.showNotification(title,{  
          body: message,icon: icon,tag: notificationTag  
        });  
      });  
    }).catch(function(err) {  
      console.error('Unable to retrieve data',err);

      var title = 'An error occurred';
      var message = 'We were unable to get the information for this push message';  
      var icon = URL_TO_DEFAULT_ICON;  
      var notificationTag = 'notification-error';  
      return self.registration.showNotification(title,tag: notificationTag  
        });  
    })  
  );  
});

它总是显示

We were unable to get the information for this push message

代码中提到的SOME_API_ENDPOINT是什么?
我尝试使用https://android.googleapis.com/gcm/send而不是端点,并且在服务工作者中使用用户端点但不工作.

任何帮助深表感谢

解决方法

据我所知,提到的SOME_API_ENDPOINT是一个API后端,用于简化客户端从其他应用程序访问数据.

Overview of Cloud Endpoints年所讨论的,

Google Cloud Endpoints consists of tools,libraries and capabilities that allow you to generate APIs and client libraries from an App Engine application,referred to as an API backend,to simplify client access to data from other applications. Endpoints makes it easier to create a web backend for web clients and mobile clients such as Android or Apple’s iOS.

关于端点使用的更多信息在Best practices for Google Cloud Endpoints中完全讨论,例如如何创建App Engine后端.

您也可以使用这个SO post-Google endpoints and Google Cloud Messaging作为您可以帮助的参考之一.

猜你在找的JavaScript相关文章