Search code examples
cordovacordova-plugins

WKWebView and XHR


Currently working on a mobile app in Cordova and started development/testing on Android. Everything appears to work well and as expected on the Android platform. When switching to iOS we began running into problems. Decided to go with the WKWebView plugin and this seemed to help with some things, however, I am using a server to pull data via an API and I cannot anymore. Prior to using the WKWebView plugin the API was getting called and properly loading the information. I am using access origin in the config.xml to access this API. The main reason we can't go back to not using WKWebView is there was some weird rendering issues and scrolling wasn't "throw/toss" scrolling. You had to continuously swipe "up" or "down" to get it to move.

Was wondering if anyone here might have an idea on how to use WKWebView plugin, loading a local server to serve the www files from (mine is localhost:0), and also use access origin to access the API.

My config.xml

<?xml version='1.0' encoding='utf-8'?> <widget id="com.test.testmobile" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> <name>Test</name> <description> Mobile App for Android and iOS </description> <author email="[email protected]" href="test.com"> test </author> <content src="http://localhost:0" /> <access origin="http://10.1.0.215:6002" /> <platform name="android"> <allow-intent href="market:*" /> </platform> <platform name="ios"> <allow-intent href="itms:*" /> <allow-intent href="itms-apps:*" /> </platform> <plugin name="cordova-plugin-whitelist" spec="1" /> <feature name="CDVWKWebViewEngine"> <param name="ios-package" value="CDVWKWebViewEngine" /> </feature> <preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine" /> <preference name="AlternateContentSrc" value="http://localhost:0" /> </widget>


Solution

  • I am using a server to pull data via an API and I cannot anymore.

    Assuming this API is on an external server you're accessing with AJAX/XHR, the server response must contains CORS headers in order for WKWebView to accept it (see this Cordova issue).

    The main reason we can't go back to not using WKWebView is there was some weird rendering issues and scrolling wasn't "throw/toss" scrolling. You had to continuously swipe "up" or "down" to get it to move.

    If WKWebView with Cordova becomes intolerable (here is a list of known issues), you may wish to consider iScroll as a solution for native-feeling scrolling within UIWebView.