React Native

Setup

Please ensure that you have added these permissions to your app.

Download and save this HTML file to the assets directory of your app. Right click on the below link and "Save target as".

clanmeeting.html

Install React Native WebView

https://github.com/react-native-webview/react-native-webview/blob/master/docs/Getting-Started.md

React Native Specific Permissions

Add support for uploading files for sharing.

Add support for shared file download within your app. Mobile browser is used for the file download otherwise.

Sample Code

For more URL Parameters please check the Properties page.

​x
1
import React, { Component } from 'react';
2
import { WebView } from 'react-native-webview';
3

4
// TODO: edit these
5
const meetingHtml = 'file:///android_asset/clanmeeting.html';
6
const urlParameters = '?domain=try.clanmeeting.com&consumerId=your-consumer-id&roomName=uniqueRoomName&displayName=John+Doe';
7

8
class MyWeb extends Component {
9
  render() {
10
    return (
11
      <WebView 
12
        source={{ uri: meetingHtml + urlParameters }}
13
        originWhitelist={['*']}
14
        mediaPlaybackRequiresUserAction={false} // important
15
        domStorageEnabled={true}
16
        allowsInlineMediaPlayback={true} // important
17
        startInLoadingState={true}
18
        allowUniversalAccessFromFileURLs={true}
19
        javaScriptEnabled={true}
20
        clearCache={true}
21
        javaScriptCanOpenWindowsAutomatically={true}
22
      />
23
    );
24
  }
25
}

Adding custom events and methods (optional)

Please see Communicating between JavaScript and Native to make use of available JavaScript Events to trigger different actions within the app and vice versa.