CordovaのUIWebViewをWKWebViewへ移行しようとしてハマった


はじめに

UIWebViewを使ったiOSのアプリが近い将来AppStoreで受け付けてくれなくなるので Cordovaで作成していたアプリの移行作業を行いました。

CordovaのUIWebView→WKWebView移行についてまとめ
こちらのサイトで丁寧に説明されているので移行作業はすぐに終わるものと想定していましたが、自分の環境ではうまくいきませんでした。
自分が解決に至った手順を同じ現象の方の参考になればと思い共有します。

行ったこと

  • cordova-plugin-wkwebview-engine プラグイン追加
  • cordova-plugin-wkwebview-file-xhr プラグイン追加
  • config.xml に定義を追加
  • apiサーバーのCORS対応

発生した問題

  • jQuery Mobile のSPAアプリで、wwwディレクトリのhtmlファイルが not found になる
  • インターネット上のapiサーバーとのajax通信で、BASIC認証後のPOSTが HTTP401(Unauthorized)で失敗する

解決に至った手順

No local file access #883
こちらのサイトにcordova-plugin-wkwebviewxhrfix を使えとあったので、cordova-plugin-wkwebview-file-xhrを削除してこのプラグインを追加

I've faced the same issue and it fixes it, only need to install @ahovakimyan/cordova-plugin-wkwebviewxhrfix

CORS対策は不要だった

サーバー側で、

Header always set Access-Control-Allow-Origin "*"

とか

Header always set Access-Control-Allow-Origin "file://"

等なにをやってもダメでしたが cordova-plugin-wkwebviewxhrfix を入れたらサーバー側のCORS対策がなくても問題ありませんでした

[email protected]で動作した環境

cordova-plugin-wkwebviewxhrfixプラグインはバージョン0.1.0を入れます。

cordova plugin add cordova-plugin-wkwebviewxhrfix@0.1.0

各種バージョン

項目 内容
Cordova Version9.0.0
Cordova platform [email protected]
cordova-plugin-wkwebview-engine 1.2.2
cordova-plugin-wkwebviewxhrfix 0.1.0

設定ファイル

config.xml
<preference name="WKWebViewOnly" value="true"/>
<preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine"/>
<feature name="CDVWKWebViewEngine">
    <param name="ios-package" value="CDVWKWebViewEngine"/>
</feature>

[email protected]で動作した環境 2021/09/29追記

Cordovaのバージョンを10、iOSのバージョンを6に上げて、
iOS@6用のcordova-plugin-wkwebviewxhrfixプラグインに変更します。

cordova plugin rm cordova-plugin-wkwebviewxhrfix
cordova plugin add https://github.com/AraHovakimyan/cordova-plugin-wkwebviewxhrfix

各種バージョン

項目 内容
Cordova Version10.0.0
Cordova platform [email protected]
cordova-plugin-wkwebview-engine iOS@6に統合されたので削除
cordova-plugin-wkwebviewxhrfix 1.0.0

config.xmlの内容は[email protected]から変更していません。

[email protected]でxcodeの実行ログにエラー 2021/09/29追記

iOS@6に上げたら以下のエラーが表示されるようになりましたが動作上は問題ありません。(気持ち悪いですが)

CDVPlugin class WKWebViewXHRFix (pluginName: wkwebviewxhrfix) does not exist

さいごに

半日で終わる予定が丸3日かかってしまいました。
なお、[email protected]での動作確認は行っていません。