Merge pull request #12 from LonelyCpp/bug-fixes

Bug fixes

Author: LonelyCpp

src/YoutubeIframe.js

@@ -6,9 +6,9 @@ import React, {
   forwardRef,
   useState,
 } from 'react';
-import {View, StyleSheet} from 'react-native';
+import {View, StyleSheet, Platform} from 'react-native';
 import WebView from 'react-native-webview';
-import {PLAYER_STATES, PLAYER_ERROR} from './constants';
+import {PLAYER_STATES, PLAYER_ERROR, CUSTOM_USER_AGENT} from './constants';
 import {EventEmitter} from 'events';
 import {MAIN_SCRIPT, PLAYER_FUNCTIONS} from './PlayerScripts';
 
@@ -18,19 +18,20 @@ const YoutubeIframe = (
     width,
     videoId,
     playList,
-    playListStartIndex = 0,
     play = false,
-    onChangeState = _event => {},
-    onReady = _event => {},
-    onError = _err => {},
-    onPlaybackQualityChange = _quality => {},
     mute = false,
     volume = 100,
-    playbackRate = 1,
-    onPlaybackRateChange = _playbackRate => {},
-    initialPlayerParams = {},
     webViewStyle,
     webViewProps,
+    playbackRate = 1,
+    onError = _err => {},
+    onReady = _event => {},
+    playListStartIndex = 0,
+    initialPlayerParams = {},
+    forceAndroidAutoplay = false,
+    onChangeState = _event => {},
+    onPlaybackQualityChange = _quality => {},
+    onPlaybackRateChange = _playbackRate => {},
   },
   ref,
 ) => {
@@ -163,13 +164,22 @@ const YoutubeIframe = (
   return (
     <View style={{height, width}}>
       <WebView
-        style={[styles.webView, webViewStyle]}
         ref={webViewRef}
         originWhitelist={['*']}
-        source={{html: MAIN_SCRIPT(videoId, playList, initialPlayerParams)}}
-        mediaPlaybackRequiresUserAction={false}
-        allowsInlineMediaPlayback
         onMessage={onWebMessage}
+        allowsInlineMediaPlayback
+        style={[styles.webView, webViewStyle]}
+        mediaPlaybackRequiresUserAction={false}
+        allowsFullscreenVideo={!initialPlayerParams?.preventFullScreen}
+        source={{html: MAIN_SCRIPT(videoId, playList, initialPlayerParams)}}
+        userAgent={
+          forceAndroidAutoplay
+            ? Platform.select({android: CUSTOM_USER_AGENT, ios: ''})
+            : ''
+        }
+        onShouldStartLoadWithRequest={request => {
+          return request.mainDocumentURL === 'about:blank';
+        }}
         {...webViewProps}
       />
     </View>

src/constants.js

@@ -1,16 +1,19 @@
 export const PLAYER_STATES = {
-  "-1": "unstarted",
-  "0": "ended",
-  "1": "playing",
-  "2": "paused",
-  "3": "buffering",
-  "5": "video cued"
+  '-1': 'unstarted',
+  '0': 'ended',
+  '1': 'playing',
+  '2': 'paused',
+  '3': 'buffering',
+  '5': 'video cued',
 };
 
 export const PLAYER_ERROR = {
-  "2": "invalid_parameter",
-  "5": "HTML5_error",
-  "100": "video_not_found",
-  "101": "embed_not_allowed",
-  "150": "embed_not_allowed"
+  '2': 'invalid_parameter',
+  '5': 'HTML5_error',
+  '100': 'video_not_found',
+  '101': 'embed_not_allowed',
+  '150': 'embed_not_allowed',
 };
+
+export const CUSTOM_USER_AGENT =
+  'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/77.0.3865.90 Safari/537.36';