Articles in this section

How to install Mobile SDK?

Installation Packages

Our highly recommended mobile solution is to use our Android and iOS SDKs found here.
Installation and Usage guides can be found there:

Mobile App Installation without Forethought SDKs (NOT RECOMMENDED)

All mobile platforms are implemented using similar patterns. A “Get Help” button of some sort opens up a new WebView screen inside of the mobile app. The URL passed to the WebView will look like https://solve-widget.forethought.ai/?data-api-key=\(API_KEY). Other parameters such as data and configuration parameters may also be passed via the URL for different widget configurations. 

The WebView screens will need to be set up in a way that they can receive messages from the Forethought widget. For example, if the WebView receives the message “forethoughtWidgetClosed” it will usually want to go back to the previous screen. We have demos for each platform to help you along the way.

WebView Guides:

Messaging

Android

  • webView.settings.javaScriptEnabled = true
  • addJavaScriptInterface and name it JSBridge
  • widget will call window.JSBridge.postMessage
  • inside of your private class JSBridge the following code will receive the message (i.e. “forethoughtWidgetClosed”)
@JavascriptInterface
fun postMessage(other: String) {
if (other == “forethoughtWidgetClosed”) {
// do something
}
}

iOS

  • In loadView() add the following
let contentController = WKUserContentController()
contentController.add(self, name: "widgetObservable")
let config = WKWebViewConfiguration()
config.userContentController = contentController
  • Create a WKScriptMessageHandler extension
  • widget will call window.webkit.messageHandlers.widgetObservable.postMessage
// example WKScriptMessageHandler extension to receive messages
extension <YourWebViewClass> : WKScriptMessageHandler {
    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
let dict = message.body as! String
let jsonData = Data(dict.utf8)
let responseData  = try? JSONDecoder().decode(WidgetData.self, from: jsonData)
guard let data = responseData else { return }
if data.event == "forethoughtWidgetClosed" {
// do something
}
}
}

React Native onMessage example

onMessage={message => {
const { event } = JSON.parse(message.nativeEvent.data);

switch (event) {
case "forethoughtWidgetClosed":
// close the WebView here

return;

case "forethoughtWidgetIntegrationHandoff":
const data: {
additionalParameters?: Record<string, unknown>;
department?: string;
email: string;
event: "forethoughtWidgetIntegrationHandoff";
featureFlags?: string[];
integration: "zendesk" | "salesforce" | ...;
name: string;
question: string;
} = message.nativeEvent.data;

// perform handoff here

return;
  }
}}
Was this article helpful?
1 out of 2 found this helpful

More resources

  • Need support?

    Submit a request and our support team will assist you

  • Business hours

    Monday to Friday 8am - 5pm PST excluding US holidays

  • Contact us

    support@forethought.ai