0

I am trying to create my first ios cordova app via Volt Builder online build service (successor to Phonegap Build) which uses cordova 11 + cordova-ios 6.2.0. When I try to load a local file from the www folder with an ajax call I get an error on the app. The code works fine in Chrome desktop and almost identical code works in several android apps, so I believe the problem lies in config.xml and not the code itself.

whatever code is in comments, I have tried some combination of it without success. (I am also aware that "async: false" doesn't work on iOS)

index.html

    //$.support.cors = true;
    $.ajax({
        //async: false,
        type: "GET",
        url: "lang/en/strings.xml",
        dataType: "text",
        //cache: false,
        //headers: { "cache-control": "no-cache" },
        success: function(data) { /*do stuff here*/ },
        error: function(e){ alert(e.statusText); }
    });

config.xml (the relevant stuff only)

<access origin="*" />
<allow-navigation href="*" />
<allow-intent href="http://*/*" />
    
<plugin name="cordova-plugin-network-information" />
<plugin name="cordova-plugin-inappbrowser" />
<plugin name="cordova-plugin-browser" source="npm"/>
<plugin name="cordova-plugin-dialogs" />
<plugin name="cordova-plugin-device" />
<plugin name="cordova-plugin-file" />
<plugin name="cordova-plugin-filepath" source="npm"/>

<platform name="ios">
    <preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine" />
    <preference name="WKWebViewOnly" value="true" />
    <feature name="CDVWKWebViewEngine">
        <param name="ios-package" value="CDVWKWebViewEngine" />
    </feature>

    <!--<plugin name="@globules-io/cordova-plugin-ios-xhr" source="npm" version="1.0.3" />-->
    <plugin name="cordova-plugin-wkwebview-engine" source="npm"/>
    <plugin name="cordova-plugin-wkwebviewxhrfix" source="npm" />
    <!--<plugin name="cordova-plugin-wkwebview-file-xhr" source="npm"/>-->
    <!--<plugin name="@ahovakimyan/cordova-plugin-wkwebviewxhrfix" source="npm" />-->
</platform>

I have tried so many combinations of the above plugins that I have lost count, but all I get on the app is the 'error' alert.

I am aware of the following similar questions, but couldn't get it to work for me

Local (!) AJAX-Requests fail without error message in cordova-based app only in iOS

Why is jQuery Ajax not working in Cordova iOS app

In-app AJAX not working in iOS with Cordova 10

Orestis
  • 11
  • 2

2 Answers2

1

As I found out the hard way, you cannot define a plugin inside the <platform name="ios">, but have to do so globally.

Just the <plugin name="cordova-plugin-wkwebview-file-xhr" source="npm" version="3.0.0" /> (in the right place..) get's the job done.

<!-- more plugins/etc here-->
<plugin name="cordova-plugin-wkwebview-file-xhr" source="npm" version="3.0.0" />

<platform name="ios">
    <preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine" />
    <preference name="WKWebViewOnly" value="true" />
    <feature name="CDVWKWebViewEngine">
        <param name="ios-package" value="CDVWKWebViewEngine" />
    </feature>
    <!-- more stuff here -->
</platform>
Orestis
  • 11
  • 2
0

I am able to fix this issue without any third party plugin. Add these lines on your config.xml file. That solved my problem of xhr from local files ie from. www folder.

<platform name="ios">
    <preference name="scheme" value="app" />
    <preference name="hostname" value="localhost" />
</platform>
Sandeep
  • 131
  • 1
  • 10