无法在Android Webview中使用AJAX加载HTML部分

Question

I'm trying to load an HTML partial in my "app" that are running I an Android webview . Everything is made with HTML, CSS, and jQuery.

Every time my code is trying to load an HTMl partial it returns an error:

XMLHttpRequest cannot load file:///W:/smarthubwebapp/public_html/html/pageHtml/login.html. Cross origin requests are only supported for protocol schemes: HTTP, data, chrome, chrome-extension, https, chrome-extension-resource.

I know in this case it loaded in chrome and not in the Android webview I want to use in the end.

All the files that I use in the project local files so they are called with the "file:///" protocol in the webview. Should it not work if I just open the index file in the browser and how do I fix this?

My ajax piece looks like this:

$.ajax({
    url: "html/pageHtml/" + pageToLoad + ".html",
    type: "GET",
    crossDomain: true,
    dataType: 'html',
    success: function (response) {
        $("#pageContainer").html("<div id='innerPageContainer'>" + response + "</div>");
    },
    error: function (xhr, status) {
        $("#pageContainer").html("<div id='innerPageContainer'>" + JSON.stringify(status) + "</div>");
    }
});

Answer 1

You set the crossDomain property to true in the Ajax properties, hence the error.

Simply remove that.

The error says it all, 'File' requests can be used with crossDomain calls.