Mobile apps

Gravito CMP is provided as webview compatible configurations. The setup has been tested on following architectures:

• React Native (example project : https://github.com/GravitoLtd/react-native-webview-sample)

• Android Native (https://github.com/GravitoLtd/android-webview-sample)

• iOS Native (https://github.com/GravitoLtd/ios-webview-sample)

Webview implementation covers the hosting of UI (static files) and use of architecture specific messaging APIs to pass the status of CMP and consent string to application to store and consume.

Example of integration with React Native app

​

1. React Native initializes the Web-view by passing the URL to our hosted CMP. This is done by passing URL as a prop to the Web-view component.

2. Web-view then fetches the required content from the host and loads the HTML page.

3. On Successful loading of the page JavaScript sends the onStart message to react-native through the “ReactNativeWebView” window object.

4. This message is then received by React Native using the onMessage attribute of React Native’s WebView component.

5. React Native then sends the TC string from shared preference to the Web-view using injectJavaScript function of WebView component. This function is used to fire on message events which is then listened by CMP inside Web-view.

6. CMP then use this TC string to render the current state of consent and user can change their preferences using the checkbox controls.

7. Whenever a user performs save action, a modified TC string is sent back to React native and is then stored in shared preferences.

Example of iOS integration

1. IOS initializes the WKWebView by passing the URL to our hosted CMP. This is done by using the “loadTheUrl” function of the “ViewController” class.

2. WKWebView then fetches the required content from the host and loads the HTML page.

3. On Successful loading of the page JavaScript sends the onStart message to IOS through “webkit.messageHandlers.jsHandler” window object.

4. This message is then handled by the “userContentController” function of ViewController class.

5. IOS then sends the TC string from UserDefaults to the WKWebView using the “evaluateJavaScript” function of WebView. This function is used to fire on message events which are then listened by CMP inside WebView.

6. CMP then use this TC string to render the current state of consent and user can change their preferences using the checkbox controls.

7. Whenever a user performs save action, a modified TC string is sent back to IOS and is then stored to UserDefaults.

Example of integration with Android app

1. Android initializes the WebView by passing the URL to our hosted CMP. This is done by using the “loadUrl” function of WebView. Along with this it also exposes the object which has functionalities to get data and send data from android. This object is available as a window.Android object in WebView. Android uses “addJavascriptInterface” function of WebView to achieve this.

2. WebView then fetches the required content from the host and loads the HTML page.

3. JavaScript then gets the TC string from the android code using the functions exposed by the Window.Android object.

4. This TC string is then used by CMP to render the current state of consents.

5. When the user performs save action, modified TC string is then sent back and stored in shared preference using function exposed by the Android window object.

Resources

Webview demo : https://webview.cmp.gravito.net/ (being updated at the moment)

Alternatively the CMP can be developed to utilize CMP as an API service on which the TCF complexity etc. is implemented on the server-side and the UI can be rely on components already available within the application framework, only the actions are sending API requests to consent/deny all/set of purposes, features etc. and TCF compliant consent string is returned on each action reflecting the changes.

Read more on separate section​