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
1.9k
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
7k
Flutterで動画配信するプラグインを作った話
espresso3389
4
2.2k
FlutterでiOSアプリを作ってIn-House配布
espresso3389
5
1.4k
Other Decks in Technology
See All in Technology
Shift-from-React-to-Vue
calm1205
3
1.3k
Oracle Cloud Infrastructureデータベース・クラウド:各バージョンのサポート期間
oracle4engineer
PRO
27
12k
CAMERA-Suite: 広告文生成のための評価スイート / ai-camera-suite
cyberagentdevelopers
PRO
3
270
チームを主語にしてみる / Making "Team" the Subject
ar_tama
4
310
「 SharePoint 難しい」ってよく聞くけど、そんなに言うなら8歳の息子に試してもらった
taichinakamura
1
620
AWS re:Inventを徹底的に楽しむためのTips / Tips for thoroughly enjoying AWS re:Invent
yuj1osm
1
570
Amazon_CloudWatch_ログ異常検出_導入ガイド
tsujiba
4
1.6k
Automated Promptingを目指すその前に / Before we can aim for Automated Prompting
rkaga
0
110
事業者間調整の行間を読む 調整の具体事例
sugiim
0
1.5k
バクラクにおける可観測性向上の取り組み
yuu26
3
420
分布で見る効果検証入門 / ai-distributional-effect
cyberagentdevelopers
PRO
4
700
新R25、乃木坂46 Mobileなどのファンビジネスを支えるマルチテナンシーなプラットフォームの全体像 / cam-multi-cloud
cyberagentdevelopers
PRO
1
130
Featured
See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
126
18k
KATA
mclloyd
29
13k
Ruby is Unlike a Banana
tanoku
96
11k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
92
16k
Bash Introduction
62gerente
608
210k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
3
370
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
231
17k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
A better future with KSS
kneath
238
17k
Code Review Best Practice
trishagee
64
17k
Mobile First: as difficult as doing things right
swwweet
222
8.9k
Embracing the Ebb and Flow
colly
84
4.4k
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