Correct folder to bundle data files and read them in Cordova, on both Android and iOS?

I have a Cordova app that needs to read various data files I’m bundling with the app, on both Android and iOS. Which folder should I put them into when building the app, and how should I read them? (they’re all small text files around a few K to a few tens of K).

So far I’ve had them in www/data/ and using an AJAX request to read the files that worked fine on local browser based simulator (VSCode with Cordova Tools extension and displaying in Chrome) and as a deployed app on Android. iOS fails however with errors "Cross origin requests are only supported for HTTP." and "XMLHttpRequest cannot load file:///var/containers/Bundle/Application/[Some Hex code here]/[data file name] due to access control checks."

I’ve then tried the code below instead, using Cordova’s file plugin:

function ReadAppBundleFile(fileName, successfn, errorfn = null) 
var pathToFile = cordova.file.applicationDirectory + 'www/data/' + fileName;
console.log("pathToFile: ", pathToFile);
window.resolveLocalFileSystemURL(pathToFile, function(fileEntry) { // Get a local path to file
    fileEntry.file(function(file) { // Get a file pointer to the file
        var reader = new FileReader(); // Create a file reader
        reader.onloadend = function(e) { // Function to run once readAsText (next line below) has finished loading the file
            successfn(JSON.parse(this.result)); // Parse text file as JSON into JS object, then pass that to the supplied success function
        reader.readAsText(file); // Read the file in as a text file
    }, function(e) {console.log("file read error 1: ", e);}); // errorfn); // errorHandler.bind(null, fileName)); // If error in getting file pointer, call error function
}, function(e) {console.log("file read error 2: ", e);}); // errorfn); // errorHandler.bind(null, fileName)); // If error in getting local path to file, call error function

e.g. ReadAppBundleFile('somedatafile', function(data) { datafromfile = data; })

On the simulator this outputs:

pathToFile:  http://localhost:8000/www/data/somedatafile

and error: DOMException: A URI supplied to the API was malformed, or the resulting Data URL has exceeded the URL length limitations for Data URLs.

So, which folder should I put my data into when building the app, and how should I read it?


The location of the folder is probably not the problem - you need to set your CORS policy. Both Android and iOS have toughened this up in recent releases.

Here’s some info which may help.