株式会社カサレアル BSブログ

2022/06/27時点での備忘録となります。

環境

• Flutter: 2.5.3
• webview_flutter: 2.1.1
  • Flutter公式で提供されているWebViewとなります
• iOS: 15.5
• Bootstrap: 4.5.2
  • WebViewで開いた先のページで利用するBootstrapです

現象

Flutterのバージョンを1系から2系へアップグレードする対応によって、FlutterのWebViewで開いたページでJavaScriptのalert()やconfirm()が使えなくなる現象が発生しました。

本件はFlutterのGitHub上でも議論されているようです。そのうち修正されるかもしれません。未確認ですがAndroidだと発生しない、とありますね。

対応

既存のalert()やconfirm()処理を、BootstrapのModal表示に置き換えました。

また、そのまま利用するとやや冗長な記述になってしまうため、BootboxJS というJavaScriptライブラリを導入しています

// 対応前
if (confirm('XXXしてよろしいでしょうか')) {
 // 処理実行メソッド呼び出し 
}

// 対応後（BootboxJS導入部は割愛）
bootbox.confirm('XXXしてよろしいでしょうか', function (result) {
    if (result) {
        // 処理実行メソッド呼び出し
    } 
});

その他の対応案として「別のプラグイン（flutter_inappwebviewなど）でWebView機能を実現する」などもありましたが、今回は既に稼働済みのアプリで影響範囲も大きいため棄却しました。

おわりに

おそらく本事象は恒久的な話ではなく、そのうちバージョンアップによって対応されるはずです。Flutterは盛り上がってきていますが、枯れた技術ではないのでこういった事象も結構あります。本記事が誰かの助けになれば幸いです。

Tweet

Check