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
LIFF API のセキュリティ的な話
Search
捧隆二
March 28, 2023
Technology
0
590
LIFF API のセキュリティ的な話
捧隆二
March 28, 2023
Tweet
Share
More Decks by 捧隆二
See All by 捧隆二
LINEミニアプリ/LIFFアプリを サクッと作りたいならFirebase
arahabica
3
2.1k
LIFFで認証しようとしたら意外と奥が深かった話
arahabica
0
1.9k
Firebase x LINE / Ruby on Rails x LINEでログイン画面を無くそう
arahabica
0
2.3k
公式管理画面 vs 非公式管理画面
arahabica
0
550
Share Target Pickerを使ってLIFFアプリを拡散しよう
arahabica
0
1k
Share Target Pickerを使って消えるメッセージを作ってみた
arahabica
0
7.7k
非公式LINE管理画面を作ってみた
arahabica
0
440
Clovaで他とは違うスマートスピーカー体験
arahabica
0
140
LINEグループであそぼ
arahabica
1
400
Other Decks in Technology
See All in Technology
Generative AI Japan 第一回生成AI実践研究会「AI駆動開発の現在地──ブレイクスルーの鍵を握るのはデータ領域」
shisyu_gaku
0
270
Function Body Macros で、SwiftUI の View に Accessibility Identifier を自動付与する/Function Body Macros: Autogenerate accessibility identifiers for SwiftUI Views
miichan
2
180
DroidKaigi 2025 Androidエンジニアとしてのキャリア
mhidaka
2
310
【NoMapsTECH 2025】AI Edge Computing Workshop
akit37
0
190
現場で効くClaude Code ─ 最新動向と企業導入
takaakikakei
1
250
まずはマネコンでちゃちゃっと作ってから、それをCDKにしてみよか。
yamada_r
2
110
dbt開発 with Claude Codeのためのガードレール設計
10xinc
2
1.2k
エラーとアクセシビリティ
schktjm
1
1.3k
TS-S205_昨年対比2倍以上の機能追加を実現するデータ基盤プロジェクトでのAI活用について
kaz3284
1
170
Terraformで構築する セルフサービス型データプラットフォーム / terraform-self-service-data-platform
pei0804
1
180
Agile PBL at New Grads Trainings
kawaguti
PRO
1
430
RSCの時代にReactとフレームワークの境界を探る
uhyo
10
3.4k
Featured
See All Featured
Making Projects Easy
brettharned
117
6.4k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
31
2.2k
[RailsConf 2023] Rails as a piece of cake
palkan
57
5.8k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.5k
GitHub's CSS Performance
jonrohan
1032
460k
Building Better People: How to give real-time feedback that sticks.
wjessup
368
19k
Git: the NoSQL Database
bkeepers
PRO
431
66k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
9
810
Side Projects
sachag
455
43k
4 Signs Your Business is Dying
shpigford
184
22k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Transcript
LINE Developer Community 【React/Vercelハンズオン】LINEミニアプリ×microCMSでサロン向けアプリを作ろう LIFF API のセキュリティ的な話 2022.03.28 捧 隆⼆
1
⾃⼰紹介 捧 隆⼆ (ささげ りゅうじ) ITエンジニア ⼤学院在学中に⼤阪でITスタートアップを起業。 上京後、外資系ITコンサル、フィンテック企業を経験。 2019年にボイスアップラボの創業メンバーとして参画。LINE関連 の開発に従事。
LINE BOOT AWARDS 2018 部⾨賞受賞。2021年よりLINE API Expert。 趣味は温泉めぐり。 2 Arahabica @Arahabica1
今回のハンズオンにおける認証 3
今回のハンズオンにおける認証 • 認証はほぼしていない • LINEのユーザーIDをそのままMicroCMSに保存 Ø ユーザーIDを知っているだけでは認証にはならない 4
今回のハンズオンにおける認証 • 認証はほぼしていない • LINEのユーザーIDをそのままMicroCMSに保存 Ø ユーザーIDを知っているだけでは認証にはならない Ø 本番環境では危険︕ 5
なぜ危ない︖ • IDの漏洩リスク • 他のユーザの情報を表⽰する際に漏れるリスク 6 Aさん Bさん Cさん Ranking
なぜ危ない︖ • IDの漏洩リスク • 他のユーザの情報を表⽰する際に漏れるリスク • IDなので変更不能 • IDなので暗号論的に安全に⽣成される乱数とは限らない •
ID: 001があるとID: 002もあるかもしれない。 • 推測、総当たり可能性 7
LIFFの認証 8
LIFFの認証 1. LIFFでアクセストークンを取得 2. アクセストークンをサーバに送信 3. サーバからLINEにアクセストークンを送りプロフィール取得 4. 問題なければ認証成功 9
LIFFの認証 1. LIFFでアクセストークンを取得 2. アクセストークンをサーバに送信 3. サーバからLINEにアクセストークンを送りプロフィール取得 4. 問題なければ認証成功 Ø
公式のドキュメントに詳細載っています。 https://developers.line.biz/ja/docs/liff/using-user-profile/#use-user- info-on-server 10
LIFFの認証の実装の流れ 11
LIFFの認証の実装の流れ 1. LIFFアプリを初期化 12 LINE ミニアプリ Server 1. 初期化
LIFFの認証の実装の流れ 1. ミニアプリを初期化 2. トークン取得 13 LINE ミニアプリ Server 1.
初期化 2. トークン取得
LIFFの認証の実装の流れ 1. ミニアプリを初期化 2. トークン取得 3. トークン送付 14 LINE ミニアプリ
Server 1. 初期化 2. トークン取得 3. トークン送付
LIFFの認証の実装の流れ 1. ミニアプリを初期化 2. トークン取得 3. トークン送付 4. トークン検証 15
LINE ミニアプリ Server 1. 初期化 2. トークン取得 3. トークン送付 4. トークン検証
LIFFの認証の実装の流れ 1. ミニアプリを初期化 2. トークン取得 3. トークン送付 4. トークン検証 5.
認証情報共有 16 LINE ミニアプリ Server 1. 初期化 2. トークン取得 3. トークン送付 4. トークン検証 5. 認証情報共有
LIFFの認証の実装の流れ 1. ミニアプリを初期化 2. トークン取得 3. トークン送付 4. トークン検証 5.
認証情報共有 Ø ここが⼀番たいへん Ø 認証ライブラリが想定していない 17 LINE ミニアプリ Server 1. 初期化 2. トークン取得 3. トークン送付 4. トークン検証 5. 認証情報共有
FirebaseによるLIFFの認証の実装 18
FirebaseによるLIFFの認証の実装 • Firebase Authenticationのカスタムトークン作成機能を使うと対応可能 19
FirebaseによるLIFFの認証の実装 • Firebase Authenticationのカスタムトークン作成機能を使うと対応可能 1. ミニアプリを初期化 2. トークン取得 3. トークン送付
4. トークン検証 20 LINE Cloud Functions Authentication 1. 2. 3. 4.
FirebaseによるLIFFの認証の実装 • Firebase Authenticationのカスタムトークン作成機能を使うと対応可能 1. ミニアプリを初期化 2. トークン取得 3. トークン送付
4. トークン検証 5. カスタムトークン作成 21 LINE Cloud Functions Authentication 1. 2. 3. 4. 5. トークン作成
FirebaseによるLIFFの認証の実装 • Firebase Authenticationのカスタムトークン作成機能を使うと対応可能 1. ミニアプリを初期化 2. トークン取得 3. トークン送付
4. トークン検証 5. カスタムトークン作成 6. カスタムトークン取得 22 LINE Cloud Functions Authentication 1. 2. 3. 4. 5. トークン作成 6. トークン取得
FirebaseによるLIFFの認証の実装 • Firebase Authenticationのカスタムトークン作成機能を使うと対応可能 1. ミニアプリを初期化 2. トークン取得 3. トークン送付
4. トークン検証 5. カスタムトークン作成 6. カスタムトークン取得 7. カスタムトークンで認証 23 LINE Cloud Functions Authentication 1. 2. 3. 4. 5. トークン作成 6. トークン取得 7. トークンで認証
FirebaseによるLIFFの認証の実装 • Firebase Authenticationのカスタムトークン作成機能を使うと対応可能 1. ミニアプリを初期化 2. トークン取得 3. トークン送付
4. トークン検証 5. カスタムトークン作成 6. カスタムトークン取得 7. カスタムトークンで認証 • 詳細は記事参照 • https://qiita.com/Arahabica/items/8f5c7472ded92128535f 24 LINE Cloud Functions Authentication 1. 2. 3. 4. 5. トークン作成 6. トークン取得 7. トークンで認証