Cordova 10にバージョンアップする際にハマったこと


MonacaのプロジェクトをCordova 10.0(Cordova iOS 6.1.1、Cordova Android 9.0.0)にバージョンアップして色々とハマったのでまとめます(Cordova iOS 6.0.0でUIWebViewが完全に削除された関係でiOSの内容が多めです)
ちなみにXcodeのバージョンも12.2にアップデートしています。

※MonacaのプロジェクトをCordova 10にバージョンアップする方法については以下を参照ください。
https://docs.monaca.io/ja/release_notes/20201119_cordova10/

(iOS) cordova-plugin-wkwebview-engineに依存しているプラグイン

Cordova iOS 6.0.0以降からCordova本体にWKWebViewが統合されました。そのため、cordova-plugin-wkwebview-engineは非推奨になり、Cordova iOS 6.0.0以降でビルドするとエラーになります。

私のケースだと、cordova-plugin-migrate-localstorageというUIWebViewからWKWebViewにLocalStorageのデータを移行するプラグインがcordova-plugin-wkwebview-engineに依存していたためエラーになっていました。

このケースではplugin.xmlを開いて、<dependency id="cordova-plugin-wkwebview-engine" version="^1.1.0" />を削除して対応しました。

(iOS) cordova-plugin-inappbrowserのバージョンアップ

cordova-plugin-inappbrowserを利用している場合、UIWebViewが含まれていない4.0.0以降にアップデートする必要があります。

window.openが上書きされなくなった

3.2.0まではwindow.opencordova.InAppBrowser.openで上書きしていたため、例えばブラウザでURLを開く処理をwindow.open(url, '_system')のように書くことができましたが、4.0.0から上書きされなくなりました

InAppBrowserの機能をwindow.openで利用していた場合、window.opencordova.InAppBrowser.openで置換するか、以下のように手動でwindow.openの上書きを行う必要があります。

window.open = cordova.InAppBrowser.open;

(iOS) スプラッシュスクリーンが閉じられない

cordova-plugin-splashscreenを使用してスプラッシュスクリーンを表示していたのですが、navigator.splashscreen.hide()を呼び出してもスプラッシュスクリーンが非表示にならないことがありました。

どうやら、Cordova iOS 6.0.0以降でAutoHideSplashScreenfalseSplashScreenDelayが設定されている場合に発生するようです。
SplashScreenDelayを削除すれば非表示にすることができました。

参考: https://github.com/apache/cordova-plugin-splashscreen/issues/307

(iOS) Custom Schemeプラグインの削除

Monacaが提供しているCustom Schemeプラグインは同等の機能をCordova 10.0が提供するため、 Cordova 10.0にアップデートするとプロジェクトから自動で削除されます。

その際、config.xmlには以下の設定が追加されます。これは、アプリにバンドルするリソース(HTMLなど)のスキームがmonaca-app、ホスト名がlocalhostになるという意味です。

<platform name="ios">
  <preference name="scheme" value="monaca-app"/>
  <preference name="hostname" value="localhost"/>
</platform>

ここで注意すべきはCustom Schemeプラグインの場合、ホスト名がmonaca.ioになるという点です。
元々Custom Schemeプラグインを導入していたアプリで、ホストをlocalhostにしたままビルドするとオリジンが異なるため、ローカルストレージなどの値が参照できなくなってしまいます。
ローカルストレージなどを引き継ぎたい場合は以下のようにホスト名をmonaca.ioにする必要があります。

<preference name="hostname" value="monaca.io"/>

参考: https://qiita.com/kishisuke/items/df8b20a78e9d6843ab01

また、Cordova iOS 5.xまでは(Custom Schemeプラグインを使っていなかった場合)、fileスキームによるアクセスを行います。そのため、デフォルトの設定ではCustom Schemeプラグインと同様に別オリジンとなります。
Cordova iOS 6.xでもfileスキームのままにしたい場合はschemefileにするか、schemeのpreferenceタグを削除すれば良いです。

(Android) minSdkVersion

Cordova Android 9.0.0より、minSdkVersionを22(Android 5.1)以上にする必要があります。