Skip to main content

Cordova/Capacitor SDK

To integrate the Atomic SDK into your Cordova or Capacitor app, you'll use the Atomic Web SDK. Therefore, for full documentation for the Cordova/Capacitor SDK, please see the Web SDK documentation page.

Installation

To use the Web SDK with your Cordova or Capacitor app:

  1. Download the Atomic SDK from our CDN, and bundle it with your application. There are two files you need to download:

https://downloads.atomic.io/web-sdk/release/0.19.2/iframe-manager.js

  • https://downloads.atomic.io/web-sdk/release/0.19.2/sdk.js
Download specific version

Replace latest with a version number (e.g. 0.19.0) to download that specific version.

  1. (Cordova only): Modify the Content-Security-Policy meta tag in your Cordova app to allow the following URLs, after the default-src directive:
  • Your SDK API host URL from the Workbench, found by going to the Workbench, then Configuration > SDK > API Host;
Use the SDK API host url

The SDK API host URL is different to the API base URL endpoint, which is also available under Configuration. The SDK API host URL ends with client-api.atomic.io.

  • blob:, required for the SDK frame to render.
  1. Include the sdk.js and iframe-manager.js files as two standalone scripts, added to your app as script tags. The iframe-manager.js script tag must also have the ID atomic-frame-manager, and must appear before the sdk.js tag.

  2. Enable the cordova feature via the stream container configuration object:

<html>
...
<body>
<!-- Include the following scripts on your page (must be in this order) -->
<script src="js/iframe-manager.js" id="atomic-frame-manager"></script>
<script src="js/sdk.js"></script>

<!-- Initialize the SDK (Cordova example using the deviceready event) -->
<script>
document.addEventListener('deviceready', function() {
AtomicSDK.initialise('<apiHostUrl>', '<apiKey>', '<environmentId>')

AtomicSDK.launch({
onAuthTokenRequested: () => {
return Promise.resolve('<authToken>')
},
...
features: {
cordova: {
enabled: true
}
}
})
}.bind(this), false);
</script>
</body>
</html>