Setup - LoyaltyLion

The LoyaltyLion SDK supports bi-directional communication with your mobile app to facilitate more advanced features. For example, with Shopify mobile apps this can be used to have LoyaltyLion ask your app to add a voucher code or free product to the current cart.

Setting up a WebView for advanced features

iOS WKWebView
Android WebView

When LoyaltyLion is embedded in a WKWebView, we’ll use the WKScriptMessageHandler interface to send messages to your app.You’ll need to register the listeners you want to support with your content controller, and then handle them appropriately. The example below listens to the ready event to detect when the Loyalty Page has finished loading.

class ViewController: UIViewController, WKScriptMessageHandler {
  override func viewDidLoad() {
    let contentController = WKUserContentController()

    // subscribe to LoyaltyLion events
    contentController.add(self, name: "sdkReady")

    // continue creating WKWebView instance...
  }

  func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
    if message.name == "ready" {
      print("LoyaltyLion SDK is ready")
    }
  }
}

When LoyaltyLion is embedded in an Android WebView, you can add a LoyaltyLionBridge JavaScript interface which we’ll use to emit events.The example below sets up a WebView, registers the LoyaltyLionBridge and registers a ready handler to detect when the Loyalty Page has finished loading.

class MainActivity : AppCompatActivity() {
    lateinit var webView: WebView

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        webView = WebView(this)
        setContentView(webView)

        webView.settings.javaScriptEnabled = true
        webView.addJavascriptInterface(LoyaltyLionBridge(), "LoyaltyLionBridge")

        webView.loadDataWithBaseURL(null, "...", "text/html", "utf-8", null)
    }

    inner class LoyaltyLionBridge {
        @JavascriptInterface
        fun sdkReady() {
            Log.d("WebView", "LoyaltyLion SDK ready")
        }
    }
}

​Setting up a WebView for advanced features

Setting up a WebView for advanced features