FRESH! における Web プッシュ通知機能 〜実装編〜 | CyberAgent Developers Blog
はじめまして。FRESH! でフロントエンドの開発をしている池田 (こりら) です。 この記事では、Web Push の実装概要や FRESH! における Web プッシュ通知機能 〜機能設計編〜 をもとに、実際に FRESH! でどのように Web Push 通知機能を実装したのかを紹介します。 アジェンダ Web Push の実装概要 Web Notifications API Web Push API Firebase Cloud Messaging (FCM) Service Worker push イベント notificationclick イベント FRESH! における Web プッシュ通知の実装 FCM に関連する処理をユーティリティ化 通知に関する実装 チュートリアルの実装 チャンネルページ・登録情報の管理ページの実装 各ブラウザの個別対応 Chrome (59) Fi
FRESH!におけるWebプッシュ通知機能 〜機能設計編〜 | CyberAgent Developers Blog
はじめまして。FRESH!でディレクターをしています、西野です。 今回は、先日FRESH!で対応したWebプッシュ通知機能についてご紹介したいと思います。 Webプッシュ通知機能をリリースするに至った経緯 FRESH!は生放送サービスなので、リアルタイムで番組開始通知を受け取ることが重要です。 しかし今までPCのFRESH!では、サイトを開いていないと番組の開始を知ることができず、好きな配信主がいきなり配信を始めた場合などに気付くことができませんでした。 ▼サイト上に番組開始通知が届いた様子 一方、Webプッシュ通知機能を使えば、FRESH!のサイトを開いていなくても番組の開始を知ることができるようになります。 PCユーザーからの「開始通知を受け取るためにアプリをダウンロードしている」という声もあり、必要性は十分に感じていました。 Webプッシュ通知機能の紹介 FRESH!にログイン後、通
Web Budget API と Web に導入されつつある Budget と Cost の概念 | blog.jxck.io
Intro PWA の普及により、バックグラウンド処理をいかに制限するかといった課題が生まれた。 その対策として、バックグラウンド処理における Budget と Cost の概念が提案され、それを扱う Budget API の策定が進んでいる。 基本概念と現時点での API 外観について解説する。 Update 提案されて以降長いことアップデートがなかったが、 Mozilla Standard Position をリクエストしたところ、仕様が消えていたことがわかった。 https://github.com/mozilla/standards-positions/issues/73#issuecomment-373681407 元のリポジトリに Issue で現状を問い合わせたところ、結局開発者からの支持が得られず、 Obsolete されたとのこと。 blink-dev では Intent
FCMでWeb Push。Firebase Javascript SDKを使ったプッシュ通知とトピック送信を試した。 - 平日インプット週末アウトプットぶろぐ
FirebaseのFirebase Cloud Messaging（FCM）を試している。今回のエントリではFCMのJavaScriptライブラリを使ってブラウザにプッシュ通知やトピックにメッセージを送信する方法をまとめていく。 FCMではトピックや端末グループへのメッセージングなどの機能が利用できる。これらの機能をPush APIをサポートしているブラウザにも同様に利用することができる。 developers-jp.googleblog.com ここからはFCMのJavaScriptライブラリの使い方とサーバからメッセージを送信する方法などクライアントとサーバに分けてまとめていく。 クライアント クライアントではJasvaScript SDKを通してトークンを取得する。そのトークンをサーバに送りストレージに保持させる。 サーバではトークンを用いてFCMと連携を行い通知リクエストを送信する
Web PushをFCMとVAPIDで認証してブラウザにプッシュ通知を送る - 平日インプット週末アウトプットぶろぐ
Web Pushを試している。調べていく過程で２つの認証方式を用いてプッシュ通知を送信できることが分かった。１つはFirebase Cloud Messaging（FCM）を使い取得したサーバーキーを認証に使い送信する方法とVoluntary Application Server Identification for Web Push (VAPID)で認証をする方法である。 2つの方法としたがWeb Pushが標準化する過程で整理された認証方法であり、VAPIDのほうが後発となりFirebaseのサーバーキーを必要としない認証方式である。 VAPIDはFirebaseのプロジェクト登録が不要となるだけでプッシュサーバはFirebase Cloud Messagingが担っている。 今回のエントリではFCMとVAPIDそれぞれのWeb Pushのプッシュ通知方法をまとめていく。 また試したブ
ウェブ用 Firebase Cloud Messaging が利用可能になりました
.app 1 .dev 1 #11WeeksOfAndroid 13 #11WeeksOfAndroid Android TV 1 #Android11 3 #DevFest16 1 #DevFest17 1 #DevFest18 1 #DevFest19 1 #DevFest20 1 #DevFest21 1 #DevFest22 1 #DevFest23 1 #hack4jp 3 11 weeks of Android 2 A MESSAGE FROM OUR CEO 1 A/B Testing 1 A4A 4 Accelerator 6 Accessibility 1 accuracy 1 Actions on Google 16 Activation Atlas 1 address validation API 1 Addy Osmani 1 ADK 2 AdMob 32 Ads
Push Notifications on the Open Web | Blog | Chrome for Developers
If you ask a room of developers what mobile device features are missing from the web, push notifications are always high on the list. Push notifications allow your users to opt-in to timely updates from sites they love and allow you to effectively re-engage them with customized, engaging content. As of Chrome version 42, the Push API and Notification API are available to developers. The Push API i
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
