Setup

install react native webview package, the library wont work with the default webview

yarn install react-native-webview

install package

yarn install react-native-webview-bridge-seamless

make sure you import webview from react-native-webview and not from react-native

import {WebView, WebViewSharedProps} from 'react-native-webview';
import {withWebViewBridge} from 'react-native-webview-bridge-seamless';

wrap the webview

export const WebViewWithBridge = withWebViewBridge(WebView);

Usage

1class MySmartWebView extends React.Component<> {
2    constructor(props) {
3        super(props);
4        this.getToken = this.getToken.bind(this);
5    }
6
7    async getToken(type) {
8       if (type === 'A')
9          return await getTokenA();
10       else
11          return await getTokenB();
12    }
13
14    render() {
15       return <WebViewWithBridge
16            source={{uri: 'https://your-page.io'}}
17            reactNativeApi={{
18                getToken: this.getToken
19            }}
20         />
21    }
22}
23

inside your web application we can interact with the defined app in the following way

1const timeout = 5000; // promise will fail if no response in 5 seconds
2const tokenA = await window.getReactNativeApi(timeout).getToken('A');