[flutter] flutter_inappwebviewでcookieのデータを取得する方法まとめ

はじめに

こんにちは、今回はプロジェクトの要件でwebviewからcookieを取得する必要があり、実装する機会がありましたのでここで共有します。

flutterでwebviewを実装するには、webview_flutterか、flutter_inappwebviewで実装するのがスタンダードだと思います。
今回はflutter_inappwebviewで実装します。
webview_flutterでも実装できそうな印象ですが（詳しくは調べてない）、flutter_inappwebviewの方が実装の自由度が高いイメージがあるので今回はこちらを採用しました。

概要

今回はライブラリのインポートは省略します。
flutter_inappwebview
詳細は上記の公式ドキュメントを参照してください。

全コード

class TestWebView extends StatelessWidget {
  const TestWebView({super.key});

  @override
  Widget build(BuildContext context) {

    InAppWebViewController? webViewController;
    CookieManager cookieManager = CookieManager.instance();


    return Scaffold(
      body: InAppWebView(
        initialUrlRequest: URLRequest(url: Uri.parse('任意のURL')),
        onWebViewCreated: (controller) {
          webViewController = controller;
        },

        onLoadStop: (controller, url) async {
          // Cookieを取得
          List<Cookie> cookies = await test(
            Uri.parse('任意のURL'),
            cookieManager,
          );

          print(cookies);
        },
      ),

      
    );
  }
}

Future<List<Cookie>> test(Uri url,CookieManager cookieManager) async{
  List<Cookie> cookies = await cookieManager.getCookies(url: url);

  return cookies;
}

解説

一旦cookie取得のことは忘れてewbviewの実装を解説します。

webview実装

class TestWebView extends StatelessWidget {
  const TestWebView({super.key});

  @override
  Widget build(BuildContext context) {

    InAppWebViewController? webViewController;

return Scaffold( body: InAppWebView(
        initialUrlRequest: URLRequest(url: Uri.parse('任意のURL')),
        onWebViewCreated: (controller) {
          webViewController = controller;
        },)
}};

これに関しては特に解説は不要かと思います。
initialUrlRequestパラメータで表示したいurlを指定します。
onWebViewCreatedパラメータではcontrollerの参照を更新しています。
詳細に関しては別記事を参考にしてみてください。

cookieの取得

いよいよ本題です。
まあそんなに難しいことはなくやっていることは限りなくシンプルです。

cookie取得

 CookieManager cookieManager = CookieManager.instance();

    onLoadStop: (controller, url) async {
          // Cookieを取得
          List<Cookie> cookies = await test(
            Uri.parse('任意のURL'),
            cookieManager,
          );

          print(cookies);
        },

Future<List<Cookie>> test(Uri url,CookieManager cookieManager) async{
  List<Cookie> cookies = await cookieManager.getCookies(url: url);

  return cookies;
}

dartにはcookieManagerというcookieを取得するためのメゾットが用意されてあります。
今回はこれを利用してcookieを取得しています。

testという関数の中でFuture型のcookieをListで取得してます。

今回はonLoadStopというwebviewの読み込みが完了したタイミングで取得していますが、
ボタンを押下したタイミングなどそこは各自で調整してください。

まあ強いていうなら非同期で取得しなければいけないのでそこを気をつけるとかでしょうか。
意外と簡単に取得できるので驚きました。