This is perhaps the last plugin left to learn in this Cordova series.

The Whitelist plugin allows us to apply whitelist policy for navigation in app. The whitelist plugin is installed and by default applied when you create new Cordova project. You can open the config.xml file to see allow-intent default settings provided by Cordova.

Navigation Whitelist

In the below example, we are allowing links to some external URL. This code is placed in config.xml. Navigation to file:// URLs is allowed by default.

<allow-navigation href = "http://example.com/*" />

 The asterix sign, *, is used to allow navigation to multiple values. In the example above we are allowing navigation to all sub domains of the example.com. The same method can be applied to protocol or prefix to the host.

<allow-navigation href = "*://*.example.com/*" /> 

Intent Whitelist

This also allow-intent element which is used to specify which URLs are allowed to open the system. You can see in the config.xml that Cordova already allowed most of the required links for us.

Network Request Whitelist

Inside config.xml file, there is <access origin="*" /> element. This element allows all network requests to our app through Cordova hooks. If you want to allow only specific requests, you can remove it from the config.xml and set it yourself.

The same rule is used as in previous examples.

<access origin = "http://example.com" />

 

All network requests from http://example.com will be allowed.

Content Security Policy

Inside head element in index.html file, you can check out content security policy for your app.

<meta http-equiv = “Content-Security-Policy" content = "default-src

   'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src

   'self' 'unsafe-inline'; media-src *">

If you want to allow everything from the same and example.com you can use – origin as this is a default configuration.

<meta http-equiv = "Content-Security-Policy" content = "default-src 'self' foo.com"> 

You also have permission to allow everything, but restrict CSS and JavaScript to the same origin.

<meta http-equiv = "Content-Security-Policy" content = "default-src *;

   style-src 'self' 'unsafe-inline'; script-src 'self'

   'unsafe-inline' 'unsafe-eval'">