cordova-plugin-file in Chrome: cordova is not defi

Question

I use cordova-plugin-file in my ionic app to download images and save to local.

When I run it in emulator or iphone, there is no error, but when I test it in Chrome, it says, cordova is not defined when I try to access cordova.file.dataDirectory

How can I run cordova-plugin-file in chrome?

Answer 1

Cordova will not be available in the browser; only on your device.

In your index.html you should have this script reference:

<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>

As the note says, the script won't be available during the development. It will be replaced during the build process.

You can try it yourself:

cordova platform add android

then

cordova build

and you should find under platforms\android\assets\www 2 js files: cordova.js and cordova_plugins.js.

Another option is to add browser as platform:

cordova platform add browser

and the run it:

cordova run browser

but you might face a few troubles.

Answer 2

What you easily could do is copy cordova.js yourself to your root directory for testing.The file resides e.g in the directory

cordova-project/platforms/ios/platform_www

You could easily just copy it over. If you do it the cordova object is available and can be accessed in your code e.g.

cordova.file.dataDirectory

A good approach for debugging and testing Cordova applications is the Cordova browser plugin in conjunction with Phonegap installed to get access to the

phonegap serve browser 

command. That way you can conveniently test your application right on your computer and don't have to send it to your device. It needs to be said that above mentioned cordova.file.dataDirectory is not available on your computer. Some plugins provide proxies for the browser platform that you could test them in your browser, too. For me the good thing with phonegap serve browser is when you edit your code and save it and then reload your browser the change get reflected.

I have to mention one more point to get the code changes reflection working.You have to create a

.cordova

directory inside your Cordova project root folder. Then you have to add a config.json file inside with following content:

{
"lib": {
    "www": {
        "id": "com.phonegap.helloworld",
        "version": "3.5.0",
        "uri": "https://github.com/phonegap/phonegap-app-hello-world/archive/3.5.0.tar.gz"
    }
}
}

As stated in following post from SO: Get phone gap serve working in Cordova project