iFrame and WebView in the mobile app

2 min

If you send data from the native portion of the app and from a WebView within the app, each generates their own Experience Cloud ID (ECID), which results in disconnected hits and inflated visit / visitor data.

To solve for that undesirable situation, it’s important to pass the user’s ECID from the native portion of your app to a WebView you might want to use in your app.

The AEP Edge Identity extension used within the WebView collects the current ECID and adds it to the URL instead of sending a request to Adobe for a new ID. The implementation then uses this ECID to request the URL.

External docs here: https://experienceleague.adobe.com/en/docs/platform-learn/implement-mobile-sdk/app-implementation/web-views

In the Live Demos mobile app you can demo the ECID being passed from mobile application to the external page included through WebView in the Luma public project.

Switch to the Luma Public Project

Scroll down on the home page until you will see the banner: "Luma Performance Collection"

Click on it - a WebView Page will be open within the app

You can see the technical details about what is being passed to the page.

You can now visit platform and check if the event webview.loaded is being assigned to the profile you are using in the app. Go to the Adobe Demo System Shared org, choose: Public Project - Luma sandbox.

Data Collection attached to the WebView: https://experience.adobe.com/#/@demosystem4/sname:prod/data-collection/tags/companies/CO248bee8aabe04648b1421ee94f8e416b/properties/PR25b9dbdaa42e4c7c932c966596ef0a75/rules

If you want you can copy the webview page and connect it with your own sandbox: Sample page can be copied from here https://demo-system-next.s3.amazonaws.com/assets/demo/iframe-demo-website/index-raw.html - make a copy and update with your data collection script. After that update your mobile WebView screen with the link.