Cordova: links to javascript files located in local resource Not allowed

Question

The Status:

I have some java script files I download from my server and save them in the device storage, and want to link them to my index.html just like this:

<script 
    type="text/javascript" 
    src="file:///data/data/<app_id>/files/path/to/my-script.js/">
</script>

and the same for CSS.

This the error:

Not allowed to load local resource:
file:///data/data/<app_id>/files/path/to/style.css

NOTE: this was allowed in the previous versions of cordova, but since I updated to cordova 5, I forced to install the plugin whitelist and then this permission error appeared.

Answer 1

I resolved this problem by creating an embed tiny web server into Cordova with this plugin CorHttpd Cordova Plugin

then simply refer to the stylesheet by as following:

<link src="http://localhost:8080/css/file.css">

and you can refer to JS file by the following:

<script src="http://localhost:8080/js/script.js" ><script>

Answer 2

I assume you are trying to achieve this on Android. If thats correct I suppose you can use the following to resolve any file on the external file system:

window.resolveLocalFileSystemURL(path, cbSuccess, cbFail);



path - {string} a cordova path with scheme: 
                     'cdvfile://localhost/<file-system-name>/<path-to-file>' 
                 Examples: 'cdvfile://localhost/sdcard/path/to/global/file'
                           'cdvfile://localhost/cache/onlyVisibleToTheApp.txt'
cbSuccess - {function} a callback method that receives a DirectoryEntry object.

cbFail - {Function} a callback method that receives a FileError object.

This though requires some configuration.

config.xml

<preference name="AndroidPersistentFileLocation" value="Compatibility" />
<preference name="AndroidExtraFilesystems" value="sdcard,cache" />

AndroidManifest.xml

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

Used the following question for instance.