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で位置情報を扱う
Search
Hifumi Takai
July 29, 2025
Programming
0
2
LIFFで位置情報を扱う
LINEミニアプリ Tech Meetup #2
https://classmethod.connpass.com/event/356983/
Hifumi Takai
July 29, 2025
Tweet
Share
More Decks by Hifumi Takai
See All by Hifumi Takai
LIFFアプリにJPYC決済を導入しよう
thanaism
0
14
AKSで学ぶBicepのアレコレ
thanaism
0
790
Other Decks in Programming
See All in Programming
AIの誤りが許されない業務システムにおいて“信頼されるAI” を目指す / building-trusted-ai-systems
yuya4
7
4.2k
クラウドに依存しないS3を使った開発術
simesaba80
0
210
ゆくKotlin くるRust
exoego
1
190
2年のAppleウォレットパス開発の振り返り
muno92
PRO
0
180
Go コードベースの構成と AI コンテキスト定義
andpad
0
150
SQL Server 2025 LT
odashinsuke
0
120
ローカルLLMを⽤いてコード補完を⾏う VSCode拡張機能を作ってみた
nearme_tech
PRO
0
240
Spinner 軸ズレ現象を調べたらレンダリング深淵に飲まれた #レバテックMeetup
bengo4com
1
210
.NET Conf 2025 の興味のあるセッ ションを復習した / dotnet conf 2025 quick recap for backend engineer
tomohisa
0
110
例外処理とどう使い分ける?Result型を使ったエラー設計 #burikaigi
kajitack
15
3.7k
AI 駆動開発ライフサイクル(AI-DLC):ソフトウェアエンジニアリングの再構築 / AI-DLC Introduction
kanamasa
11
4.9k
LLMで複雑な検索条件アセットから脱却する!! 生成的検索インタフェースの設計論
po3rin
4
1.1k
Featured
See All Featured
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
0
220
KATA
mclloyd
PRO
33
15k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
100
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
38
2.7k
Speed Design
sergeychernyshev
33
1.5k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
0
100
Ethics towards AI in product and experience design
skipperchong
1
160
It's Worth the Effort
3n
187
29k
B2B Lead Gen: Tactics, Traps & Triumph
marketingsoph
0
40
Code Reviewing Like a Champion
maltzj
527
40k
Paper Plane (Part 1)
katiecoart
PRO
0
2.8k
Transcript
LIFFで位置情報を扱う 意外と多い落とし⽳ キリフダ株式会社 タナイ @okinawa__noodle
はじめに 本⽇のLT内容は、以下の記事でも解説しています! (ほかにもZennにいくつか記事を投稿しているので読んでもらえると嬉しいです) 2 記事読み込みはコチラのQRで!
公式ドキュメントを⾒よう LIFFは、 ネイティブアプリのWebView機能の上で動作する 普通のWebアプリ https://developers.line.biz/ja/docs/line-mini-app/discover/specifications/#html5-support https://developers.line.biz/ja/docs/liff/overview/#liff-browser-spec もちろん使える 3 よく見ると添付画像がミニアプリの画面ではなく 位置情報も許可されていない
WebViewごとに設定箇所が分かれる 4 LIFFは、 ネイティブアプリのWebView機能の上で動作する 普通のWebアプリ ⼀般ユーザーからしたら どれも同じくブラウザだが… 以下すべて位置情報の設定箇所が異なる! • Safari
• iOS版 Google Chrome • iOS標準のQRリーダーから開くWebView • LIFFブラウザ わかるわけない! そもそもLIFFを使う動機のひとつに一般ユーザーが慣れ親しんだ LINE上でシームレスな体験を提供したい というのがある
LINEアプリ内の設定もあわせるともっと増える LINE関連の設定は⼤きく分けて以下の4つ 5 1. OSレベルでの位置情報許可 LINEアプリ⾃体がOS設定レベルで位置情報を取得する要求に対しての許可 2. Geolocation APIレベルでの位置情報許可 LIFFブラウザで開かれたWebアプリがGeolocation
APIで位置情報を取得する要求に対しての許可 3. LINEプラットフォームによる位置情報収集 LINEプラットフォームによる位置情報収集に対しての許可 4. LINE Beacon LINE Beaconに対しての許可 権限不⾜時に Geolocation APIは どちらの拒否か 判別不可 !
1. OSレベルの許可 • なにかの拍⼦でユーザーが⼀度拒否していると、 LIFF側から要求してもこのダイアログが出ない • 拒否状態から復帰させようとすると、 設定箇所が深い位置にあり分かりにくい • 「正確な位置情報」をONにしないと
誤差が数キロ単位で出るので実質使えない 6 OSレベルの許可ダイアログ ユーザー⾃⾝に解決させるのが だいぶきつい なにかの拍⼦で 拒否していると 出てこない !
位置情報メッセージ送信画⾯なら直接設定画⾯へ LIFFから位置情報を取得失敗した時に、 この画⾯に誘導できれば楽 • Messaging APIで説明メッセージ送信し、 クイックリプライで位置情報アクション • liff.sendMessagesを利⽤できる条件なら メッセージを送り、それに対して返信
7 liff.sendMessagesにクイックリプライ付きで応答する例 liff.sendMessagesを挟むと、 応答扱いで無料となる
2. Geolocation APIレベルの許可 OSレベルでの位置情報の許可が取れている場合、 WebViewはGeolocation APIによる位置情報取得のダイアログを表⽰する。 8 OSレベルの許可で「次回または共有時に確認」を設定していると: OSレベルの要求ダイアログが都度開く設定のため、 連続で似たようなダイアログが表⽰されるユーザー体験になる
Geolocation APIレベルの許可ダイアログ ! OSレベルで拒否されていると、 このダイアログすら表示されない ことに注意
iOS WebViewでGeolocation APIレベルの要求を2回連続で拒否 すると、 永久にダイアログが表示されなくなる! 最⼤の落とし⽳:iOSでの連続拒否 9 ! チャンスは 2回まで
• ドメイン単位で永続的に拒否が既定値に • LINEアプリの設定画⾯からもリセット不可 • ユーザーが意図せず「詰む」ケースとなる 通常Safariは詳細設定からリセット可能だが、 LIFFブラウザだと対応する設定へのアクセス⼿段がない
永続拒否への対策 10 位置情報の取得要求をおこなう 前に、 説明ダイアログを表示 して事前に離脱させる 1 位置情報が必要な理由を 明確に伝え、 ユーザーの誤操作を防ぐ
ドメインを変える (パワープレイなので対策と言えるかは微妙) 2 • iOS WebViewの許可情報はドメイン単位 • LIFFのエンドポイントURLを変更すれば初期状態に • 認証済みミニアプリの場合は再審査が必要 • 本番URLを固定し、位置情報関連のみ 別ドメインに切り出す⼯夫もありえなくはないが… ミニアプリポリシー「外部のウェブサイトへの誘導」に該当するため、 すんなり審査通るかは未知数
⽤途によってはLINE Beaconも 11 LINE Beacon 端末(開発用途) (引用:https://beacon.theshop.jp/items/6617930) 端末導⼊コスト:5,000円以上 同時に兼⽤不可。⼀応、電⼦⼯作できるなら⾃作もできるらしい※ 要ユーザー設定:LINEアプリのBeacon許可ほか
デフォルトOFFの設定のため、ユーザー誘導が別途必要 ※ ラズベリーパイでLINE Beaconが作成可能に! 「LINE Simple Beacon」仕様を公開しました 施設への往訪トリガーなどは実現可能! 永続拒否問題を回避しながらMessaging APIのイベントを受領 ドキュメントに明⽰的に書かれていないポイントとして、 ユーザー設定は必要だが、往訪してから許可してもイベント発⽕はする模様
まとめ 12 まずはOSレベルの許可をうながそう 位置情報アクションなどを活⽤ ユーザーの連続拒否を防ぐ設計にしよう くどくはなるが、事前ダイアログで拒否する前に離脱を促進 ワンチャンLINE Beaconも使ってみよう ハードルは⾼いが、Geolocation APIではできないことも実現可能
ふだんはSaaS開発とか カスタマイズ受託とかしてます! 絶賛エンジニア募集中!