Cordova Plugin Whitelist
In Cordova version 4.0 or higher, you can implement a whitelist policy to navigate your application WebView using this specific plugin. Before we go further, let us discuss about the domain whitelist. The plugin whitelist can be defined as the security model that is responsible for controlling an access to the external domains. The Cordova mainly offers a configurable security policy that defines which of the external sites can be accessed. If we want to know about the compatibility of the plugin, it is supported in Android 4.0.0 or above.
To add this plugin in your app, you must require to install it. You can install the plugin from Cordova CLI or npm. For doing this, you need to type the below command:
The main task of the navigation whitelist is to control which URLs the WebView itself can be navigated to. It should be noted that the specific plugin is applicable only for top-level navigations. Also note that file:// URLs is the only allowed default navigations. You must need to add <allow-navigation> tags to the config.xml file of an app to allow the other URLs,:
This whitelist is responsible for controlling those URLs which an app allows to ask to open. For doing this, we need to add the <allow-intent> tags in config.xml. The below code demonstrates how it will be done:
In case, if the <allow-intent> tags are not used then it means that the external URLs requests will not allow. By default, the liberal set of allow-intent entries are included in the default Cordova application. Based on the requirement of each app's, it is recommended to narrow this down.
If we talk about the Android platform, it is similar to send an intent of type BROWSEABLE.
Basically, this whitelist is not applied to the plugins. It is only for the hyperlinks and for the calls to window.open().
Network Request Whitelist
For controlling the network requests (images, XHRs, etc) that are allowed to be made via cordova native hooks, the Network Request Whitelist is used.
We recommend that you should use a Content Security Policy because it is more secure.
We need to add the <access> tags in the config.xml file. The below code shows how it will be done:
In the above code, we have used a set of <access> tags. If <access> tags are not used, then only request to file:// URLs are allowed. However, by default <access origin="*"> included by the default Cordova application.
Note: For reducing the redirect to the non-whitelisted websites, CSP rules should be followed for those webviews that supports CSP.
Content Security Policy
It is used to control the network requests such as images, XHRs, etc that are allowed to be made using the WebView directly.
If we talk about the Android and iOS platforms, the network request whitelist can not filter all types of requests such as <video> & WebSockets. You should use Content Security Policy <meta> tag with the whitelist for all the pages.
Example of CSP declarations:
For seeing the current security policy, see inside the head element in index.html file.
See the following code:
This is a default configuration. The below code is responsible for allowing everything from the same origin and example.com.
If we talk about the variations in the behaviour of whitelist for various platforms, some of the variations can be noticed by platform or these whitelist features based on the concerns and capabilities of the underlying native technology.