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
FlutterのWebView プラグインどれ使えば?
Search
Takashi Kawasaki
November 07, 2019
Technology
2
2.1k
FlutterのWebView プラグインどれ使えば?
FlutterでWebView使いたいんだけど、標準の奴だとちょっとバグがあって困るんだけど、ネイティブだとWidget Treeに打ち込めないし、うーん、何を使おう。
Takashi Kawasaki
November 07, 2019
Tweet
Share
More Decks by Takashi Kawasaki
See All by Takashi Kawasaki
Flutterプラグインでdart:ffiを使ってみる
espresso3389
5
7.3k
Flutterで動画配信するプラグインを作った話
espresso3389
4
2.3k
FlutterでiOSアプリを作ってIn-House配布
espresso3389
5
1.5k
Other Decks in Technology
See All in Technology
会社員しながら本を書いてきた知見の共有
sat
PRO
3
690
Scale Security Programs with Scorecarding
ramimac
0
440
toittaにOpenTelemetryを導入した話 / Mackerel APM リリースパーティ
cohalz
1
490
Babylon.jsでゲームを作ってみよう
limes2018
0
100
Java で学ぶ 代数的データ型
ysknsid25
1
470
ソフトウェアテストのAI活用_ver1.10
fumisuke
0
240
GoogleのAI Agent
shukob
0
140
他チームへ越境したら、生データ提供ソリューションのクエリ費用95%削減へ繋がった話 / Cross-Team Impact: 95% Off Raw Data Query Costs
yamamotoyuta
0
240
Machine Intelligence for Vision, Language, and Actions
keio_smilab
PRO
0
500
Eight Engineering Unit 紹介資料
sansan33
PRO
0
3.2k
AIエージェントデザインパターンの選び方
almondo_event
0
150
Bill One 開発エンジニア 紹介資料
sansan33
PRO
4
12k
Featured
See All Featured
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
48
5.4k
Producing Creativity
orderedlist
PRO
346
40k
We Have a Design System, Now What?
morganepeng
52
7.6k
The Invisible Side of Design
smashingmag
299
50k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
106
19k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
42
2.3k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
Facilitating Awesome Meetings
lara
54
6.4k
Designing for Performance
lara
608
69k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
26k
Typedesign – Prime Four
hannesfritz
41
2.6k
Scaling GitHub
holman
459
140k
Transcript
FlutterのWebView プラグインどれ使えば? 川崎 ⾼志 @espresso3389 クミナス株式会社
⾃⼰紹介 • 川崎 ⾼志 (@espresso3389) • クミナス株式会社 代表取締役 CEO •
恵⽐寿の会社です • なんでもやる⼈ • Flutterは好きなんだけどどちらかというと底レイヤー担当
WebViewのプラグインどれ使えば?
WebViewのプラグインどれ使えば? webview_flutter • flutter.dev 純正 • Platform Viewによる実装 flutter_webview_plugin ネイティブ
WebView をオーバーレイする実装 flutter_inappbrowser • Platform Viewによる実装 • Chrome Custom Tabs (Android) • SFSafariViewController (iOS)
webview_flutter • 純正の安⼼感(謎) • Developer Previewから正式版になりませぬ・・・ • APIは最も洗練されているように⾒えるが分かりにくいとも(?) • ドキュメントも「⽐較的」ある
• 困ったやつ(2019/11現在) • ドロップダウンクリックしたら死ぬ(#34248) • NavigationDelegateをasyncにしてくれ(#43271)
flutter_webview_plugin • ネイティブのビューを上に重ねる⽅式 • ネイティブなので安定性は良い • ⾼速動作(カクツキが少ない) • FlutterのWidget Tree上に混ぜられない
• カッコいい遷移アニメーションとかできません • webview_flutterのNavigationDelegate相当の機能がない • 困ったバグ • ネイティブビューのshow/hideが正しく動いてない(気がする)
flutter_inappbrowser • InAppBrowser という単語を最初に思い浮かべるのは難しい • 3種類のブラウザ実装(機能が豊富) • InAppWebView • InAppBrowser
• ChromeSafariBrowser • CookieManager • クッキーの管理が簡単 • InAppLocalhostServer • localhostでサーバー建てられる • webview_flutterのNavigationDelegate相当の機能がある • shouldOverrideUrlLoading • ⾯倒なところ • Swift4.1実装なのでPodfileに修正が必要
InAppWebView • ただのWebView • Platform View • webview_flutterよりAPIが素直で使い やすいが肝⼼な部分の説明が皆無。
InAppBrowser • ネイティブWebView(Platform Viewではない) • Flutterのページの上にポップアップする形で利⽤ • Platform View版より⾼速・安定動作
ChromeSafariBrowser • Chrome Custom Tabs/SFSafariViewController • TwitterやFacebookアプリなどでよく⾒るアプリ内ブラウザ • OSネイティブなので⾼速・安定動作 •
ちょっとだけカスタマイズできる • WebViewと⽐べて最近のセキュリティ関連の知⾒が⽣かさ れてる • AndroidでOAuth関連で利⽤したいならこれ使うべき • ※iOSなら下記を推奨 • ASWebAuthenticationSession(iOS12) • SFAuthenticationSession(iOS11)
おまけ • FlutterでGoogleとかメジャーじゃないところのOAuth2使いた いなら • oauth2_custom_uri_scheme