Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Webプッシュ通知触ってみた
Search
matumoto
February 22, 2023
Technology
0
31
Webプッシュ通知触ってみた
2023/2月に行われたサークル内追い出しLTの資料です
イベントページはこちら
https://zli.connpass.com/event/275487/
matumoto
February 22, 2023
Tweet
Share
More Decks by matumoto
See All by matumoto
sync/v2 プロポーザルの 背景と sync.Pool について
matumoto
0
200
Goトランザクション処理
matumoto
0
36
いまいちどスライスの 挙動を見直してみる
matumoto
0
330
Go1.22のリリース予定の機能を見る
matumoto
0
62
GoのUnderlying typeについて
matumoto
0
190
Typed-nilについて
matumoto
0
290
GoのType Setsという概念
matumoto
0
23
GoのRateLimit処理の実装
matumoto
0
340
拡張ユークリッドの互除法の紹介
matumoto
0
260
Other Decks in Technology
See All in Technology
ObsidianをLLM時代のナレッジベースに! クリッピング→Markdown→CLI連携の実践
srvhat09
7
9.8k
【2025 Japan AWS Jr. Champions Ignition】点から線、線から面へ〜僕たちが起こすコラボレーション・ムーブメント〜
amixedcolor
1
100
With Devin -AIの自律とメンバーの自立
kotanin0
2
790
ユーザー理解の爆速化とPdMの価値
kakehashi
PRO
1
110
大規模イベントを支える ABEMA の アーキテクチャ 変遷 2025
nagapad
5
510
公開初日に個人環境で試した Gemini CLI 体験記など / Gemini CLI実験レポート
you
PRO
3
620
Recoil脱却の現状と挑戦
kirik
3
460
分散トレーシングによる コネクティッドカーのデータ処理見える化の試み
thatsdone
0
270
AI時代の知識創造 ─GeminiとSECIモデルで読み解く “暗黙知”と創造の境界線
nyagasan
0
160
興味の胞子を育て 業務と技術に広がる”きのこ力”
fumiyasac0921
0
290
LLM開発を支えるエヌビディアの生成AIエコシステム
acceleratedmu3n
0
330
【CEDEC2025】LLMを活用したゲーム開発支援と、生成AIの利活用を進める組織的な取り組み
cygames
PRO
1
1.6k
Featured
See All Featured
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
357
30k
Typedesign – Prime Four
hannesfritz
42
2.7k
Testing 201, or: Great Expectations
jmmastey
43
7.6k
Building Applications with DynamoDB
mza
95
6.5k
Facilitating Awesome Meetings
lara
54
6.5k
Thoughts on Productivity
jonyablonski
69
4.8k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
The Invisible Side of Design
smashingmag
301
51k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Into the Great Unknown - MozCon
thekraken
40
1.9k
Adopting Sorbet at Scale
ufuk
77
9.5k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Transcript
Webプッシュ通知 触ってみた 追い出しLT 2023/02/22
• 学年:28期 • 所属:会津大学コンピュータ理工学部 • 今興味のある技術:Go, Haskell, Rustで競プ ロ •
趣味: ◦ モンハン ▪ 燃えないゴミはもう無いんだよ ◦ イカᔦꙬᔨ ◦ FGO ▪ 2部7章良かったね • Twitter:@matumoto_1234 matumoto 松本 響輝 自己紹介
今回触ってみた技術 • Webプッシュ通知
FirebaseCloudMessaging(FCM)の概要 • Firebaseサーバーに送り先を登録する • Firebaseサーバーから送り先に対してプッシュ通知を送る
送り先の登録処理 • デバイスで登録をする場合
送り先の登録処理 • ブラウザで登録する場合
送り先の登録処理 • では何に登録させるか? ◦ サイトごとに一意なものに登録させる( PushSubscriptionが発生する) ◦ Firebaseが用意しているSDKでmasseging.getToken(**省略*/)を呼び出す と登録トークンがFirebase側で発行されて返される(2回目以降はキャッシュされたも のが返される)
送られるとどうなるか • 送り先がサイトごとに一意 ◦ じゃあサイトを開いていないときとかは通知が来ないのでは? ◦ →ちゃんと来てくれる ▪ ServiceWorkerが受け取っている ServiceWorker
通知許可
ServiceWorkerについて • ServiceWorker発火などでなんらかの動作をしたい ◦ ServiceWorkerAPIが実は提供されている
実際に送るには • FirebaseConsoleからプッシュ通知を送ることができる • Firebase Admin SDKからも同じように送れる
実際に送るには • Firebase Admin SDKを使うメリット ◦ アプリのサーバー側から通知を叩ける
実装編
実装 • Firebaseプロジェクトを作って、生成されるサーバーキーとかを保管 • firebase-toolkitsをPCにインストール • $ firebase initとかをして生成されるindex.htmlなどのファイルに、さっきのサーバー キーとかをコピペ
• $ firebase serve でローカルファイルをホスティング • ホスティングしたlocalhost:5000とかに行って通知を許可 • FirebaseConsole(Web画面)から通知を送る • AC
デモ
ご卒業 おめでとうございます! 社会人になっても健康でいやがれください