Solved

how can I implement Amplitude to Hybrid (Webview) App

  • 2 February 2023
  • 2 replies
  • 733 views
J

Hello, I'm a data analyst.

I am trying to implement Amplitude to a Hybrid (Webview) App. Our project made web page that use JS and it’s shown on a webview inside our app (android/IOS). 

I want to implement Amplitude to mobile Web and Hybrid App. But I couldn’t find how to implement amplitude to hybrid environments in The official development guide.

I just have understood that browser SDK should be applied to the web page to collect events and user properties, and send them to the App through javascript interface. 
However, since there are few resource for hybrid app, it would be good to have some materials for hybrid app. Could I get any useful resources for development?

icon

Best answer by eddie.gaona 3 February 2023, 21:36

View original

2 replies

eddie.gaona
Rank
Userlevel 5
Badge +9

Hello @J GS happy to help!


You will need to install the Mobile SDKs(iOS, Android) to your app and the webview would need to have the Browser SDK.
 
I found this piece that was advised previously when it came to bridging both Mobile and Web SDKs that might be helpful: 

 

You can actually achieve this by doing the followings.

  1. get the session id from the native app
  2. use JS Bridge to pass the id into in-app browser
  3. use the JS setSessionId API

It’s also possible to do this with URL params if you don’t want to install the JS Bridge dependency.

From the Android app using the WebView API

long sessionId = Amplitude.getInstance().getSessionId();
myWebView.loadUrl("https://www.example.com?sessionId=" + sessionId);

Then from the webpage, extract the URL param for sessionId and use the JS setSessionId API.

Also, they also need to provide a way to access the userId from that web page too. It can be done through JS injection to webview.

 

 

J

Thanks for your help! @eddie.gaona 
I have understood that native sessionId should be passed to web JS.

Could I question one more about how to track events in mobile web and hybrid app?
Our page can be accessible through web browser and hybrid app. It’s same page.
I want to track events and distinguish the events source (from mobile web or hybrid app).
In this case, how I implement event track method by native sdk or web sdk?

I just thought rough idea. First, I should get JSONobject variable that include events and parameters in webpage JS. Then If the page was opened by hybrid app webview, pass the variable to native SDK track method by using JS bridge. And if the page was opened by web browser, just pass the variable to web SDK track method.

But I’m not sure about that because I didn’t have any experience in hybrid environment. 
Could you check the idea is correct and give advice for event tracking?

Or there is a way to get events from web SDK then pass to native SDK?

Reply


Terms & ConditionsCookie settings