Apache Cordova Newsflash!

April 24, 2015By 5 Comments

news_128x128_32Recently there have been some significant updates in Cordova to be aware of if you haven’t seen them already. These are included in the latest Cordova Android, Cordova Tools and Cordova Plugins releases this past week.

Below is a summary of the highlights in case you missed them.


  • Android 4.0.0 supports pluggable WebViews (hint: Crosswalk)

    Apache Cordova now supports pluggable WebViews for Android. This news feature allows you to easily use Crosswalk to replace the default WebView. To take advantage of Crosswalk you’ll just need to install the new Crosswalk plugin

    Crosswalk is a modern WebView that can be used instead of the default Android WebView. It provides better support for the latest HTML5 features and allows you to provide a consistent experience across the various versions of Android and different manufacturers.

    Read more in the cordova-android 4.0.0 release news here.

  • Cordova Plugins in npm and Renamed

    Cordova plugins are now stored in npm (node package manager) and renamed with id’s of cordova-plugin-*, rather than the form of org.apache.cordova.*. The new id is a bit shorter and easier to remember, which should be helpful. The CLI (version 5.0.0+) will fetch the plugin from either npm or the original Cordova Plugin Registry based on the id you specify when you add your plugin. If you use cordova-plugin-device for instance, the CLI will fetch it from npm, otherwise from the Cordova Plugin Registry when the (org.apache.cordova.device) is used.

    Developers are strongly encouraged to use the new id’s and add any existing or new plugins they’ve created there as well and add the ecosystem:cordova tag to their package.json file. Specific instructions on adding your plugin and details about this change can be found here.
  • Whitelist Handling Change

    The whitelist code was moved out of core Cordova and into a new Cordova whitelist plugin. This new whitelist is enhanced to be more secure and configurable, but the legacy whitelist behavior is still available via a separate legacy whitelist plugin but NOT recommended. Content-Security-Policy (CSP) is now supported and is the recommended approach. As a result of the new whitelist handling, you may require some additional configuration settings in the config.xml file as shown below:

        <plugin name="cordova-plugin-whitelist" spec="1" />
        <access origin="*" />
        <allow-intent href="http://*/*" />
        <allow-intent href="https://*/*" />
        <allow-intent href="tel:*" />
        <allow-intent href="sms:*" />
        <allow-intent href="mailto:*" />
        <allow-intent href="geo:*" />
        <platform name="android">
            <allow-intent href="market:*" />
        </platform>
        <platform name="ios">
            <allow-intent href="itms:*" />
            <allow-intent href="itms-apps:*" />
        </platform>
    
    NOTE: When you create a new project based on the default hello world project, your config.xml will already be preconfigured with these settings.
    IMPORTANT: Network requests are blocked by default without cordova-plugin-whitelist, so install this plugin even to allow all requests, and even if you are using CSP.

    More details can be found here.

  • Saving Plugins and Platforms

    You can save the plugins and platforms used in your project easily now a few different ways using either a save command or --save flag. Using these will cause new tags to be added to your config.xml to save the specific version so it can be auto-configured on another machine. This is super useful when working with a team or moving to another machine since you should never be checking those folders into your source control system. With this change, they are automatically added when the CLI finds them in the config.xml file during the prepare step (automatically done with a build or run) so it saves extra setup time. Note that when you remove a plugin or platform you should also specify the --save to cause it to be removed from the config.xml.

    Some examples of the different ways to use the new command or flag are shown below:

    Saving Plugins

    Using --save flag

    $ cordova plugin add cordova-plugin-device --save
    $ cordova plugin remove cordova-plugin-device --save

    This results in the following line being written ore removed from the config.xml:

        <plugin name="cordova-plugin-device" spec="1" />
    

    Using save command

    $ cordova plugin save

    The above line will save all plugins that have been added to your project at once.

    Note: The plural version also works (ie: $ cordova plugins save)

    Below are some examples and the resulting console output:

    $ cordova plugin add cordova-plugin-device --save
    Fetching plugin "cordova-plugin-device" via npm
    npm http GET https://registry.npmjs.org/cordova-plugin-device
    npm http 200 https://registry.npmjs.org/cordova-plugin-device
    npm http GET https://registry.npmjs.org/cordova-plugin-device/-/cordova-plugin-device-1.0.0.tgz
    npm http 200 https://registry.npmjs.org/cordova-plugin-device/-/cordova-plugin-device-1.0.0.tgz
    Saved plugin info for "cordova-plugin-device" to config.xml


    $ cordova plugin remove cordova-plugin-contacts --save
    Uninstalling cordova-plugin-contacts from ios
    Removing "cordova-plugin-contacts"
    config.xml entry for cordova-plugin-contacts is removed

    Saving Platforms

    Using --save flag

    $ cordova platform add ios --save
    $ cordova platform remove ios --save
    $ cordova platform update ios --save

    This results in the following line being added to your config.xml:

        <engine name="ios" spec="3.8.0" />
    

    Using save command

    $ cordova platform save

    The above line will save all platforms that have been added to your project at once.

    Note: The plural version also works (i.e.:$ cordova platforms save).

    Below are some examples and the resulting console output:


    $ cordova platform add firefoxos --save

    Adding firefoxos project...
    Project Path platforms/firefoxos
    Package Name io.cordova.hellocordova
    Project Name HelloCordova
    Installing "cordova-plugin-whitelist" for firefoxos
    Installing "org.apache.cordova.console" for firefoxos
    Installing "org.apache.cordova.contacts" for firefoxos
    Installing "org.apache.cordova.device" for firefoxos
    --save flag or autosave detected
    Saving firefoxos@^3.6.3 into config.xml file ...`

    Note how it also added any plugins added or found in the config.xml file to the added platform automatically as well.


    $ cordova platform remove firefoxos --save

    Removing firefoxos from config.xml file ...

    Read the official blog post for details and to find out the rest of the changes in the latest release.

  • Config.xml <feature> tag now <plugin>

    If you use the <feature> tag to specify custom configuration for a platform or version, you should now use the <plugin> tag. The <feature> tag will still be backwards compatible, but you should be using the <plugin> tag going forward. If you’re unsure of the details of the original <feature> tag, check out an example and more details here.

  • Filed in: CordovaMobile Development Tags:

About the Author ()

Comments (5)

Trackback URL | Comments RSS Feed

  1. Alain says:

    Hello !
    Just wanted to say I mentioned you in a talk I made a few weeks ago about ionic ! Thank you for the great resources about Cordova and hybrid mobile apps !

    http://blog.oxiane.com/2015/04/15/ionic-retour-d-experience/

    Cheers !

  2. Paul Sturm says:

    That –save flag is really going to be helpful.

  3. Adam Nemitoff says:

    Any idea why as of today the ONLY documentation I can find around the tag is in Adobe’s Phonegap Build docs? Where is the apache documentation? I am wondering how I can use a wildcard for the “spec” attribute?

Leave a Reply