Cordova WKWebView File XHR Plugin
npm install cordova-plugin-wkwebview-file-xhrThis plugin makes it possible to reap the performance benefits of using the WKWebView in your Cordova app by resolving the following issues:
* The default behavior of WKWebView is to raise a cross origin exception when loading files from the main bundle using the file protocol - "file://". This plugin works around this shortcoming by loading files via native code if the web view's current location has "file" protocol and the target URL passed to the open method of the XMLHttpRequest is relative. As a security measure, the plugin verifies that the standardized path of the target URL is within the "www" folder of the application's main bundle or in the /Library path of the application data directory.
* Since the application's starting page is loaded from the device's file system, all XHR requests to remote endpoints are considered cross origin. For such requests, WKWebView specifies "null" as the value of the Origin header, which will be rejected by endpoints that are configured to disallow requests from the null origin. This plugin works around that issue by handling all remote requests at the native layer where the origin header will be excluded.
Plugin installation requires Cordova 4+ and iOS 9+. It will install the Apache Cordova WKWebView plugin cordova-plugin-wkwebview-engine.
``
cordova plugin add cordova-plugin-wkwebview-file-xhr
Note : If your cordova-ios version is less than 6.0.0. You need to add following dependency to plugin.xml
`
Alternatively you can use this plugin's version 2.1.4
* iOS
`javascript
// read local resource
var xhr = new XMLHttpRequest();
xhr.addEventListener("loadend", function(evt)
{
var data = this.responseText;
document.getElementById("myregion").innerHTML = data;
});
xhr.open("GET", "js/views/customers.html");
xhr.send();
// post to remote endpoint
var xhr = new XMLHttpRequest();
xhr.addEventListener("loadend", function(evt)
{
var product = this.response;
document.getElementById("productId").value = product.id;
document.getElementById("productName").value = product.name;
});
xhr.open("POST", "https://myremote/endpoint/product");
xhr.responseType = "json";
xhr.setRequestHeader("Content-Type", "application/json");
xhr.setRequestHeader("Accept", "application/json");
xhr.send(JSON.stringify({name: "Product 99"}));
``
The following configuration options modify the default behavior of the plugin. The values are specified in
config.xml as preferences:
Whilst this plugin resolves the main issues preventing the use of the Apache Cordova WKWebView plugin, there are other known issues with that plugin.