Load assets from www folder on iOS 8 with Cordova

Question

I have an hybrid app that works perfectly on iOS 7 using Cordova 3.7 and jQuery Mobile 1.3.2

I am testing it on iOS 8 and it is broken. I am requesting each page(view) of my app using absolute paths, using the file:// protocol, like:

file:///var/mobile/Applications/<UUID>/MyApp.app/www/views/add-project.html

but i get the error:

Failed to load resource: The requested URL was not found on this server.

I read about this bug, is that the problem?

Also, on iOS 8, the location of the www folder is a bit different from iOS 7, it resolves to:

file:///var/mobile/Containers/Data/Application/<UUID>/MYApp.app/www/views/add-project.html

Is this correct?

I tried the toURL() and toInternalURL() methods to have the absolute paths like:

cdvfile://localhost/root/var/mobile/Containers/Bundle/Application/<UUID>/MyApp.app/ but I get always the same error. Any suggestion?

Thanks

Answer 1

hit a similar problem, adding the WWW worked!

pic.style.backgroundImage = "url('../www/images/" + id + ".jpg')";

Answer 2

To whoever might find this useful, I finally manage to solve the problem.

The full path to the www folder on ios 8+ is:

file:///private/var/mobile/Containers/Bundle/Application/<UUID>/<your_app>.app/www/

but when you request the application directory with Cordova, doing:

window.resolveLocalFileSystemURL(cordova.file.applicationDirectory, onSuccess, onError);

it will give you a wrong path (Cordova 3.7 on iOS 8.1.2) like:

file:////var/mobile/Containers/Bundle/Application/<UUID>/<your_app>.app/

using the toURL() method suggested on the docs

Therefore you need to manually do a bit of tweaking

var path = fileSystem.toURL();//given by the success callback 

IOS_ASSETS_ABS_PATH = path.replace("file:////", "file:///private/");

IOS_ASSETS_ABS_PATH += "www/";

and bingo!

Answer 3

I ran into the same problem and I managed to solve it. In my case, my problem was that every time I update the app, the new app has a different id than the last one. For instance, the path for the older app was:

file:///var/mobile/Containers/Data/Application/7A3590E8-C78A-4F45-B5B9-51FD0BAFE524/Library/files/file.pdf

And new one:

file:///var/mobile/Containers/Data/Application/1BC5FS-7B3B-90E8-C7C8-1B7C1984C2A71/Library/files/file.pdf

So even though my pdf files were still on the application data storage, I was using the wrong path since the app created a new application id. I solved this by creating a new function that updates my path every time there is an update. I find the application id by using:

window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFileSystemSuccess, fail);

function onFileSystemSuccess(fileSystem) {
    // Do what you need here
}

The filesystem is an object contains the nativeURL inside the root.

Hope it helps!