So my app receives the UIWebView deprecation warning message when submitted to ITunes connect.
I’ve added the following as specified in the documentation:
<preference name="WKWebViewOnly" value="true" />
<feature name="CDVWKWebViewEngine">
<param name="ios-package" value="CDVWKWebViewEngine" />
</feature>
<preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine" />
</platform>
<plugin name="cordova-plugin-wkwebview-engine"/>
<plugin name="cordova-plugin-inappbrowser"/>
However, when I build and try to test it goes from the splash screen to a blank white screen and no further. Is this from something still calling the UIWebView or a problem with something else? Thanks.
Here is my config -
<preference name="phonegap-version" value="cli-9.0.0" />
<preference name="cordova-ios" version="6.0.0" />
<preference name="android-build-tool" value="gradle" />
<preference name="permissions" value="none" />
<preference name="prerendered-icon" value="true" />
<preference name="android-windowSoftInputMode" value="adjustResize" />
<preference name="SplashScreenDelay" value="10000" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="FadeSplashScreen" value="false" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="DisallowOverscroll" value="true" />
<preference name="StatusBarOverlaysWebView" value="false" />
<preference name="StatusBarStyle" value="lightcontent" />
<preference name="StatusBarBackgroundColor" value="#000000" />
<preference name="android-minSdkVersion" value="19" />
<preference name="android-targetSdkVersion" value="28" />
<platform name="ios">
<preference name="WKWebViewOnly" value="true" />
<feature name="CDVWKWebViewEngine">
<param name="ios-package" value="CDVWKWebViewEngine" />
</feature>
<preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine" />
<feature name="StatusBar">
<param name="ios-package" value="CDVStatusBar" onload="true" />
</feature>
<preference name="StatusBarOverlaysWebView" value="false" />
<preference name="StatusBarStyle" value="lightcontent" />
<preference name="StatusBarBackgroundColor" value="#000000" />
<preference name="StatusBarDefaultScrollToTop" value="false" />
<icon height="1024" width="1024" src="res/PackageIcons.iOS.iTunesArtwork.png" />
<!-- 2732x2732 -->
<splash src="res/Default@2x~universal~anyany.png" />
<icon src="res/icon/ios/icon-1024.png" width="1024" height="1024"/>
<icon src="res/icon/ios/icon-small.png" width="29" height="29"/>
<icon src="res/icon/ios/icon-small@2x.png" width="58" height="58"/>
<icon src="res/icon/ios/icon-small@3x.png" width="87" height="87"/>
<icon src="res/icon/ios/icon-small-40.png" width="40" height="40"/>
<icon src="res/icon/ios/icon-small-40@2x.png" width="80" height="80"/>
<icon src="res/icon/ios/icon-small-40@3x.png" width="120" height="120"/>
<icon src="res/icon/ios/icon-small-50.png" width="50" height="50"/>
<icon src="res/icon/ios/icon-small-50@2x.png" width="100" height="100"/>
<icon src="res/icon/ios/icon.png" width="57" height="57"/>
<icon src="res/icon/ios/icon@2x.png" width="114" height="114"/>
<icon src="res/icon/ios/icon-60.png" width="60" height="60"/>
<icon src="res/icon/ios/icon-60@2x.png" width="120" height="120"/>
<icon src="res/icon/ios/icon-60@3x.png" width="180" height="180"/>
<icon src="res/icon/ios/icon-72.png" width="72" height="72"/>
<icon src="res/icon/ios/icon-72@2x.png" width="144" height="144"/>
<icon src="res/icon/ios/icon-76.png" width="76" height="76"/>
<icon src="res/icon/ios/icon-76@2x.png" width="152" height="152"/>
<icon src="res/icon/ios/icon-167.png" width="167" height="167"/>
<icon src="res/icon/ios/icon-83.5@2x.png" width="167" height="167"/>
<!-- Storyboard portrait -->
<!--<splash src="res/screen/ios/Default@2x~iphone~anyany.png"/>
<splash src="res/screen/ios/Default@2x~iphone~comany.png"/>
<splash src="res/screen/ios/Default@3x~iphone~anyany.png"/>
<splash src="res/screen/ios/Default@3x~iphone~comany.png"/>
<splash src="res/screen/ios/Default@2x~ipad~anyany.png"/>
<splash src="res/screen/ios/Default@2x~ipad~comany.png"/>-->
</platform>
<platform name="android"></platform>
<plugin name="cordova-plugin-wkwebview-engine"/>
<plugin name="cordova-plugin-inappbrowser"/>
<plugin name="cordova-plugin-whitelist" />
<plugin name="cordova-plugin-ios-longpress-fix" />
<plugin name="cordova-plugin-statusbar" source="npm" onload="true" />
<plugin name="cordova-plugin-splashscreen" spec="~5.0.2" onload="true" />
<plugin name="cordova-plugin-inappbrowser" />
<plugin name="cordova-plugin-webviewcolor" />
<access origin="*" />
<access origin="oasisws2.passtimeusa.com" />
<access origin="passtimeusa.com" />
<allow-navigation href="*" />
<allow-intent href="*" />
<preference name="phonegap-version" value="cli-9.0.0" />
<preference name="cordova-ios" version="6.0.0" />
<preference name="android-build-tool" value="gradle" />
<preference name="permissions" value="none" />
<preference name="prerendered-icon" value="true" />
<preference name="android-windowSoftInputMode" value="adjustResize" />
<preference name="SplashScreenDelay" value="10000" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="FadeSplashScreen" value="false" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="DisallowOverscroll" value="true" />
<preference name="StatusBarOverlaysWebView" value="false" />
<preference name="StatusBarStyle" value="lightcontent" />
<preference name="StatusBarBackgroundColor" value="#000000" />
<preference name="android-minSdkVersion" value="19" />
<preference name="android-targetSdkVersion" value="28" />
Try removing the inappbrowser plugin line:
plugin name=“cordova-plugin-inappbrowser”/
Thanks. Unfortunately, that had no effect.
ghenne
July 17, 2020, 2:04am
7
Do you have a Mac? It would be useful to see if there are any messages on the Console.
I do, but this was developed using DevExtreme in Visual Studio on a Windows machine. I’m not sure how to actually run it on the Mac.
ghenne
July 17, 2020, 10:14am
9
Are you seeing the problem on Android devices, or just iOS?
Just iOS. The Android build worked fine.
ghenne
July 18, 2020, 11:53am
11
Make a dev build and run it on your device (while it’s tethered to your Mac.
Open Safari and look at the Develop menu. If you don’t have one, check this out: How to Enable the Develop Menu in Safari for Mac
Now start remote debugging: How to Use Web Inspector to Debug Mobile Safari (iPhone or iPad) - AppleToolBox
I’m hoping the console window will have messages which give a hint as to what is going on.
Ok. I’ve added the develop menu on the mac and web inspector on the device and tethered the iphone. However, nothing happens when I open the app. Note, it is built as an “Enterprise” app. I believe I need to enter a URL in the mobile safari for it to debug on the mac?
ghenne
July 21, 2020, 1:21am
13
Try making a Development (“dev”) build.
I created a dev cert and provisioning profile and created the app using these settings:
“iosPackageType”: “ad-hoc”,
“platform”: “ios”,
“release”: “debug”
I’m still not seeing it in safari when run on the iphone. I select Iphone in the develop list and it says “no inspectable applications”
ghenne
July 21, 2020, 10:33am
15
Did you go through the suggestions here?
Ok. After rebooting the Mac and restarting the phone I was able to debug from the browser. Unfortunately, the console is empty. I created a super basic test app (one page hello app) and it works fine until I added the WKWebView code referenced in the documentation. At that point it just goes to a blank white screen.
After reloading the app in safari in debug, it will not load any of the html files -
First error is "Cross origin requests are only supported for HTTP.
Then each layout gives an error -"XML HttpRequest cannot load file:///private/var/containers/Bundle/application… .html due to access control checks
So looks like a CORS error when using WKWebView
Good news - I added the following and so far it appears to get around the CORS issue -
plugin name="cordova-plugin-wkwebview-engine"/
plugin name="cordova-plugin-wkwebview-file-xhr"/
plugin name="https://github.com/TheMattRay/cordova-plugin-wkwebviewxhrfix"/
plugin name="cordova-plugin-inappbrowser"/
One odd behavior is that it broke - plugin name="cordova-plugin-webviewcolor"
ghenne
July 22, 2020, 11:48am
19
I’m not sure what you’re doing, but could you also handle the CORS issues with something like this?
<plugin name="cordova-plugin-whitelist" source="npm" />
<access origin="https://*.xxx.com" />
<access launch-external="yes" origin="tel:*" />
<allow-intent href="https://*.xxx.com" />
<allow-intent href="tel:" />
<allow-navigation href="*" />
<access origin="*" />
I think you can also specify Content Security Policy in the meta data on your index page:
<meta http-equiv="Content-Security-Policy" content="default-src 'self' gap://ready file:; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; media-src 'self'; img-src 'self'; connect-src https://*.xxx.com tel:;" />
ghenne
July 22, 2020, 3:05pm
20
Cordova just published this blog post which looks useful:
Thanks. I tried building with this setting in config.xml to use Cordova 6.0.1 -
preference name=“cordova-ios” version=“6.0.1” /
But when I look at the cordova.js file in the web inspector it still shows ‘5.1.1’