lonelycpp.github.io/react-native-youtube-iframe/iframe.html Timing Out

[vestaxpdx]

Describe the bug
Suddenly today I am getting timeout errors and no YT videos will load.

Encountered an error loading page {"canGoBack": false, "canGoForward": false, "code": -8, "description": "net::ERR_TIMED_OUT", "loading": false, "target": 1683, "title": "", "url": "https://lonelycpp.github.io/react-native-youtube-iframe/iframe.html?data=%7B%22rel_s%22:0,%22loop_s%22:0,%22videoId_s%22:%229iMKruYVjkY%22,%22controls_s%22:1,%22contentScale_s%22:1,%22cc_lang_pref_s%22:%22%22,%22allowWebViewZoom%22:false,%22modestbranding_s%22:0,%22preventFullScreen_s%22:1,%22showClosedCaptions_s%22:0%7D"}

It seems GitHub is suddenly blocking these requests from my IP? Has anyone else experienced this?

Smartphone (please complete the following information):

• Device: Pixel6
• OS + version: Android 14
• react-native-youtube-iframe v2.3.0
• react-native-webview v13.8.6
• Expo verison v51.0.9

[StuartPyper]

You beat me to it, we are having the exact same issue: #338

[vestaxpdx]

Glad we are not alone! I was going crazy for a bit trying to debug...

[LonelyCpp]

only on a few devices? or all devices

I use this on one of my apps as well - works fine there

[StuartPyper]

only on a few devices? or all devices

I use this on one of my apps as well - works fine there

This is happening on multiple devices for us, both iOS and Android.

[vestaxpdx]

I feel GitHub might of changed their firewall perhaps and passing an encoded JSON string is flagging it maybe?

If I change my IP via VPN and access this file on my desktop browser I don't get at timeout anymore.

https://lonelycpp.github.io/react-native-youtube-iframe/iframe.html?data={%22rel_s%22:0,%22loop_s%22:0,%22videoId_s%22:%229iMKruYVjkY%22,%22controls_s%22:1,%22contentScale_s%22:1,%22cc_lang_pref_s%22:%22%22,%22allowWebViewZoom%22:false,%22modestbranding_s%22:0,%22preventFullScreen_s%22:1,%22showClosedCaptions_s%22:0}

As soon as I disconnect I am blocked again. Even just trying to access: https://lonelycpp.github.io results in a timeout.

I can see this being very hard to debug if it is GitHub blocking IP's...

[LonelyCpp]

a quick solution for y'all is to just host the contents on https://lonelycpp.github.io/react-native-youtube-iframe/iframe.html on your own domains

1. the html is here : https://raw.githubusercontent.com/LonelyCpp/react-native-youtube-iframe/master/iframe.html
2. host it on your own domain (https://www.example.com/iframe.html)
3. update the baseUrlOverride prop to https://www.example.com/iframe.html

[StuartPyper]

is it not simpler to add useLocalHTML={true} instead and use the bundled version of the iframe.html, or am I missing something?

[LonelyCpp]

you can check #98 for issues related to using local HTML

if it works for you, then you can use it!

[vestaxpdx]

a quick solution for y'all is to just host the contents on https://lonelycpp.github.io/react-native-youtube-iframe/iframe.html on your own domains

1. the html is here : https://raw.githubusercontent.com/LonelyCpp/react-native-youtube-iframe/master/iframe.html
2. host it on your own domain (https://www.example.com/iframe.html)
3. update the baseUrlOverride prop to https://www.example.com/iframe.html

I can confirm this is working now by self hosting. So it must be a GitHub firewall issue. Thanks for the help.

[ngualpha]

a quick solution for y'all is to just host the contents on https://lonelycpp.github.io/react-native-youtube-iframe/iframe.html on your own domains

1. the html is here : https://raw.githubusercontent.com/LonelyCpp/react-native-youtube-iframe/master/iframe.html
2. host it on your own domain (https://www.example.com/iframe.html)
3. update the baseUrlOverride prop to https://www.example.com/iframe.html

I can confirm this is working now by self hosting. So it must be a GitHub firewall issue. Thanks for the help.

Where is the baseUrlOveride prop found?

[vestaxpdx]

a quick solution for y'all is to just host the contents on https://lonelycpp.github.io/react-native-youtube-iframe/iframe.html on your own domains

1. the html is here : https://raw.githubusercontent.com/LonelyCpp/react-native-youtube-iframe/master/iframe.html
2. host it on your own domain (https://www.example.com/iframe.html)
3. update the baseUrlOverride prop to https://www.example.com/iframe.html

I can confirm this is working now by self hosting. So it must be a GitHub firewall issue. Thanks for the help.

Where is the baseUrlOveride prop found?

Add it to <YoutubePlayer />

For example:

<YoutubePlayer baseUrlOverride="https://www.example.com/iframe.html" />