Integration guide

Asklify + React Native

Embed the hosted chat page — the same UI the web widget uses — in a WebView. Full chat, streaming, and citations with ~30 lines of code.

Prerequisite: an Asklify project with some knowledge added — the quickstart covers that in a couple of minutes. You'll need your public project ID (pub_...) from Widget → Install.

Install the WebView package

terminal

npm install react-native-webview
# iOS
cd ios && pod install

Add the chat screen

Use the template below as a dedicated screen (push it from a “Support” button) or inside a modal.

Allow the domain

Add your app's origin scheme if you restrict domains — or leave mobile access on the default allowlist behavior for hosted chat.

Ready-to-use template

Copy, paste, replace the project ID — that's the whole integration:

SupportChatScreen.tsx

import React from "react";
import { SafeAreaView, StyleSheet } from "react-native";
import { WebView } from "react-native-webview";

const CHAT_URL = "https://app.asklify.in/widget/pub_YOUR_PROJECT_ID";

export function SupportChatScreen() {
  return (
    <SafeAreaView style={styles.container}>
      <WebView
        source={{ uri: CHAT_URL }}
        startInLoadingState
        // Keep navigation inside the chat experience:
        onShouldStartLoadWithRequest={(req) => req.url.startsWith("https://app.asklify.in")}
      />
    </SafeAreaView>
  );
}

const styles = StyleSheet.create({
  container: { flex: 1, backgroundColor: "#fff" },
});

All appearance and behavior — name, greeting, colors, theme, position, suggested questions — is configured in your dashboard under Widget settings and applies instantly without redeploying. See the widget configuration reference.

Event handling

To react to what happens in conversations — a chat starting, a customer requesting a human, feedback submitted — subscribe to webhooks. For fully custom experiences, the REST API exposes chat with streaming, knowledge search, and conversation transcripts.

Best practices

For a fully native UI, call the REST /chat API from your backend (never ship sk_ keys in the app bundle) and render messages yourself.
Pass a stable endUserId through your backend so conversations follow the user across devices.

Never bundle a secret API key (sk_...) in a mobile app — extractable in minutes. Mobile apps should use the hosted chat page (as above) or talk to your own backend, which holds the key.

Troubleshooting

Blank WebView on Android — ensure INTERNET permission is present and JavaScript is enabled (it is by default in react-native-webview).
Keyboard covers the input — wrap the screen in KeyboardAvoidingView on iOS.

Still stuck? Check the error reference or email hello@asklify.in.