WKWebView cannot trigger ajax to load a file on local

Question

I embed all html in WKWebView, all works until I recognize that WKWebView cannot load a xml file on the local

$.ajax({
        type: "GET",
        url: "tags.xml",
        dataType: "xml",
        cache: false,
        success: function(xml) {

        },
        error: function() {

            alert("An error occurred while processing XML file.");
        }
    });

my code for UIWebView

//urlFolder is located locally in a temporary file: tmp/www/htmlFolder 
//urlFile is located in the urlFolder: tmp/www/htmlFolder/index.html
//xml file is located in the urlFolder: tmp/www/htmlFolder/tags.xml


WKWebViewConfiguration *theConfiguration = [[WKWebViewConfiguration alloc] init];
    _webView = [[WKWebView alloc] initWithFrame:self.view.frame configuration:theConfiguration];
    [_webView loadFileURL:urlFile allowingReadAccessToURL:urlFolder];

    [self.view addSubview:_webView];

Note: I am using XCode7.1 Beta, Objective-C, ios9.1, WKWebView

Sweepback

Answer 1

From what I could find they disabled cross-origin requests in WKWebViews.

Search for cors or xhr + WKWebView for more information about this issue. I think it must be a bug of some sort, because this has always been possible in 'normal' UIWebViews using local files (like your example).

You can however run a small/lightweight http-server inside your app, which works great for me. Make sure to add an exception to the App Transport Security Settings in your .plist file for localhost.

Dextroglucose

I've been having the same issue myself, with a local script in a wkwebview making remote requests, but serving the local file from a sever in the app didn't help me, the remote server now instead complains that localhost is not in the allowed list. Do I need to do something else to make this work? – Glucinum

You need to add an exception for localhost to your NSAppTransportSecurity entry in the Info.plist file in xcode. That's because Apple no longer allows the webview to access non https webpages. – Dextroglucose

Thanks a lot for the quick reply! I'll try this, although the app is already allowing arbitrary loads (not my fault!). I was thinking I had to ask the server people to add localhost to their CORS headers, although I can't figure out if that is possible or not. Can't try that until tomorrow, so I'll give this a go! – Glucinum

It didn't help unfortunately. I'm going to try with GCDWebserver, instead of Swifter. But the issue I'm having is not with loading the local html, but the remote ajax calls its js does. I get "[Error] XMLHttpRequest cannot load apoteket.se/psoapi/minaReceptService/getKundInformation. Origin localhost:8080 is not allowed by Access-Control-Allow-Origin." from in the webview. – Glucinum

Ah I misunderstood your problem. Yeah it looks like they need to put a wildcard in their CORS headers. Not really my area of expertise though, but in php it's something like: header('Access-Control-Allow-Origin: *'); hope that helps! – Dextroglucose

Answer 2

Instead of a server locally, you can use this plugin I cobbled together from some code samples. It should enable local file access via XHR for you. I used it to restore access to a lot of local files on our app.

https://github.com/TheMattRay/cordova-plugin-wkwebviewxhrfix

Varney