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
23
Webプッシュ通知触ってみた
2023/2月に行われたサークル内追い出しLTの資料です
イベントページはこちら
https://zli.connpass.com/event/275487/
matumoto
February 22, 2023
Tweet
Share
More Decks by matumoto
See All by matumoto
Go1.22のリリース予定の機能を見る
matumoto
0
39
GoのUnderlying typeについて
matumoto
0
84
Typed-nilについて
matumoto
0
53
GoのType Setsという概念
matumoto
0
6
GoのRateLimit処理の実装
matumoto
0
89
拡張ユークリッドの互除法の紹介
matumoto
0
49
Goでの楕円曲線暗号の実装
matumoto
0
26
インターン参加記
matumoto
0
21
インデックスのパフォーマンス調べてみた
matumoto
0
21
Other Decks in Technology
See All in Technology
LINEヤフーのウェブアクセシビリティ
lycorptech_jp
PRO
3
220
The depthes of profiling Ruby - RubyKaigi 2024
osyoyu
1
300
汎用ポリシー言語Rego + OPAと認可・検証事例の紹介 / Introduction Rego & OPA for authorization and validation
mizutani
1
200
RubyKaigi 2024 - Make Your Own Regex Engine!
makenowjust
1
190
YJIT Makes Rails 1.7x faster / RubyKaigi 2024
k0kubun
4
640
Exadata Database Service on Dedicated Infrastructure(ExaDB-D) UI スクリーン・キャプチャ集
oracle4engineer
PRO
2
1.7k
OpenID Foundation updates
fujie
0
260
株式会社EventHub・エンジニア採用資料
eventhub
0
2.1k
ITエンジニアを取り巻く環境とキャリアパス / A career path for Japanese IT engineers
takatama
3
1.2k
B2C、B2B プロダクトマネジメントの違い(および思考の罠) / B2C, B2B PM and reduction fallacy
ykmc09
5
2.5k
QA経験のないエンジニアリング マネージャーがQAのカジュアル面談に出て 苦労していること・気づいたこと / scrum fest niigata 2024
yoshikiiida
2
690
スクラムに出会って「できた」を実感できるようになってきた話 / Scrum makes me feel like I can do it
yayoi_dd
2
120
Featured
See All Featured
Designing the Hi-DPI Web
ddemaree
276
33k
What's new in Ruby 2.0
geeforr
338
31k
The World Runs on Bad Software
bkeepers
PRO
61
6.8k
Why You Should Never Use an ORM
jnunemaker
PRO
51
8.7k
Art, The Web, and Tiny UX
lynnandtonic
290
19k
Rebuilding a faster, lazier Slack
samanthasiow
74
8.3k
WebSockets: Embracing the real-time Web
robhawkes
59
7k
Producing Creativity
orderedlist
PRO
338
39k
How to train your dragon (web standard)
notwaldorf
75
5.2k
Designing Experiences People Love
moore
136
23k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
34
6.1k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
242
1.2M
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
デモ
ご卒業 おめでとうございます! 社会人になっても健康でいやがれください