title: React-native live streaming with Vimeo
body: <p>I'm trying to create a page with livestream broadcast. I used WebView with embedded HTML code. Here is my code:</p>
  <pre><code>import React, {Component} from 'react';
  import {Text, View, StyleSheet} from 'react-native';
  
  import Video from 'react-native-video';
  import WebView from 'react-native-autoheight-webview';
  
  //https://vimeo.com/525411068
  
  export default class Livestream extends Component {
    videoError = () =&gt; {
      console.log('Error');
    };
    render() {
      return &lt;VimeoPlayer /&gt;;
    }
  }
  
  const VimeoPlayer = ({videoId, onError}) =&gt; {
    return (
      &lt;WebView
        style={styles.style}
        onError={onError}
        allowsFullscreenVideo
        scrollEnabled={false}
        automaticallyAdjustContentInsets
        source={{
          html: `
            &lt;html&gt;
              &lt;body&gt;
                &lt;iframe src=&quot;https://player.vimeo.com/video/${videoId}&quot; width=&quot;100%&quot; height=&quot;200px&quot; frameborder=&quot;0&quot; webkitallowfullscreen mozallowfullscreen allowfullscreen&gt;&lt;/iframe&gt;
                &lt;script src=&quot;https://player.vimeo.com/api/player.js&quot;&gt;&lt;/script&gt;
              &lt;/body&gt;
            &lt;/html&gt;
          `,
        }}
      /&gt;
    );
  };
  
  const styles = StyleSheet.create({
    backgroundVideo: {
      position: 'absolute',
      top: 0,
      left: 0,
      bottom: 0,
      right: 0,
    },
    style: {height: 200, maxWidth: '100%'},
  });
  
  VimeoPlayer.propTypes = {
    videoId: '525411068',
    onError: this.videoError,
  };
  
  </code></pre>
  <p>I have a Vimeo Pro trial and found my video code on the video dashboard but I couldn't change the privacy option for the video and it seems like it can only be viewed by me.</p>
  <p>I just wanted to create a page with Livestream on it. But I'm a newbie at react native and I would love to learn from my mistakes.</p>