diff --git a/iframe.html b/iframe.html index e5d6270..2ae881e 100644 --- a/iframe.html +++ b/iframe.html @@ -54,7 +54,20 @@ } = JSON.parse(UrlQueryData); function sendMessageToRN(msg) { - window.ReactNativeWebView.postMessage(JSON.stringify(msg)); + + if (window.ReactNativeWebView) { + // React Native WebView + window.ReactNativeWebView.postMessage(JSON.stringify(msg)); + } else if (window.parent) { + // This is from expo web iframe. + // + // We set cross origin to so that this will work on differnet origin. + // We don't expect any sensitive data to be sent. + window.parent.postMessage(JSON.stringify(msg), '*'); + } else { + console.error('Not running in Iframe, cannot postMessage.'); + return; + } } let metaString = ''; @@ -147,6 +160,8 @@ document.addEventListener('mozfullscreenchange', onFullScreenChange); document.addEventListener('webkitfullscreenchange', onFullScreenChange); + // NOTE: the 3rd parameter is needed for Android Webview. + // https://github.com/react-native-webview/react-native-webview/issues/356 window.addEventListener('message', function (event) { const {data} = event; @@ -182,7 +197,7 @@ } catch (error) { console.error('Error parsing data', event, error); } - }); + }, true); diff --git a/src/YoutubeIframe.js b/src/YoutubeIframe.js index 4bbf487..64fe34a 100644 --- a/src/YoutubeIframe.js +++ b/src/YoutubeIframe.js @@ -62,7 +62,10 @@ const YoutubeIframe = (props, ref) => { } const message = JSON.stringify({eventName, meta}); - webViewRef.current.postMessage(message); + + // NOTE: we set cross origin to so that this will work for webView for + // website hosted across different origin. + webViewRef.current.postMessage(message, '*'); }, [playerReady], ); @@ -193,6 +196,14 @@ const YoutubeIframe = (props, ref) => { break; case 'playerStateChange': onChangeState(PLAYER_STATES[message.data]); + if (message.data === -1) { + // unstartred state is -1 + // We will not normally "change" to this state, but it can happen + // if autoplay is not supported. + console.warn( + '[rn-youtube-iframe] Player unstarted - autoplay may be blocked.', + ); + } break; case 'playerReady': onReady(); diff --git a/website/static/iframe_v2.html b/website/static/iframe_v2.html index f1b25ea..1e0fc20 100644 --- a/website/static/iframe_v2.html +++ b/website/static/iframe_v2.html @@ -1 +1 @@ -
\ No newline at end of file +
\ No newline at end of file