Slide 1

Slide 1 text

FlutterのWebView プラグインどれ使えば? 川崎 ⾼志 @espresso3389 クミナス株式会社

Slide 2

Slide 2 text

⾃⼰紹介 • 川崎 ⾼志 (@espresso3389) • クミナス株式会社 代表取締役 CEO • 恵⽐寿の会社です • なんでもやる⼈ • Flutterは好きなんだけどどちらかというと底レイヤー担当

Slide 3

Slide 3 text

WebViewのプラグインどれ使えば?

Slide 4

Slide 4 text

WebViewのプラグインどれ使えば? webview_flutter • flutter.dev 純正 • Platform Viewによる実装 flutter_webview_plugin ネイティブ WebView をオーバーレイする実装 flutter_inappbrowser • Platform Viewによる実装 • Chrome Custom Tabs (Android) • SFSafariViewController (iOS)

Slide 5

Slide 5 text

webview_flutter • 純正の安⼼感(謎) • Developer Previewから正式版になりませぬ・・・ • APIは最も洗練されているように⾒えるが分かりにくいとも(?) • ドキュメントも「⽐較的」ある • 困ったやつ(2019/11現在) • ドロップダウンクリックしたら死ぬ(#34248) • NavigationDelegateをasyncにしてくれ(#43271)

Slide 6

Slide 6 text

flutter_webview_plugin • ネイティブのビューを上に重ねる⽅式 • ネイティブなので安定性は良い • ⾼速動作(カクツキが少ない) • FlutterのWidget Tree上に混ぜられない • カッコいい遷移アニメーションとかできません • webview_flutterのNavigationDelegate相当の機能がない • 困ったバグ • ネイティブビューのshow/hideが正しく動いてない(気がする)

Slide 7

Slide 7 text

flutter_inappbrowser • InAppBrowser という単語を最初に思い浮かべるのは難しい • 3種類のブラウザ実装(機能が豊富) • InAppWebView • InAppBrowser • ChromeSafariBrowser • CookieManager • クッキーの管理が簡単 • InAppLocalhostServer • localhostでサーバー建てられる • webview_flutterのNavigationDelegate相当の機能がある • shouldOverrideUrlLoading • ⾯倒なところ • Swift4.1実装なのでPodfileに修正が必要

Slide 8

Slide 8 text

InAppWebView • ただのWebView • Platform View • webview_flutterよりAPIが素直で使い やすいが肝⼼な部分の説明が皆無。

Slide 9

Slide 9 text

InAppBrowser • ネイティブWebView(Platform Viewではない) • Flutterのページの上にポップアップする形で利⽤ • Platform View版より⾼速・安定動作

Slide 10

Slide 10 text

ChromeSafariBrowser • Chrome Custom Tabs/SFSafariViewController • TwitterやFacebookアプリなどでよく⾒るアプリ内ブラウザ • OSネイティブなので⾼速・安定動作 • ちょっとだけカスタマイズできる • WebViewと⽐べて最近のセキュリティ関連の知⾒が⽣かさ れてる • AndroidでOAuth関連で利⽤したいならこれ使うべき • ※iOSなら下記を推奨 • ASWebAuthenticationSession(iOS12) • SFAuthenticationSession(iOS11)

Slide 11

Slide 11 text

おまけ • FlutterでGoogleとかメジャーじゃないところのOAuth2使いた いなら • oauth2_custom_uri_scheme