How to Play Youtube Video in Unity Webgl

Unity Engine
, ,
1

Hi Everyone, I am Making the WebGl project in Which I need to Play the YouTube Video.
I have Checked Most of the Assets on the Unity Asset Store or on the google. Some of them Claims to Work But is not Working.
I Have tried 2 Most Claiming assets.
1 - This, they Claim that there assets work fine but It Didn’t Work in both the free version or in purchase version.
2- This, this is free Asset but Require the License key to check the Demo project and the Demo license key is not Working. Also I Have Contacted with their Team but there is no response from them Yet.

I am Looking for this Solution about 2 Weeks Now.
Is there Any Solution on Unity To play the YouTube Video In Webgl or Not?
Thanks In Advance.

1 Like
2

Unfortunately I am not aware of any mechanism that Google would allow YouTube videos to be embedded without the use of their video player widget. Their own supplied video player widget is Google’s official solution that adheres to their embedding licensing rules.

See HTML YouTube Videos how that would work on normal non-WebGL HTML pages.

But unfortunately that video player widget does not support being embedded inside a 3D WebGL Canvas.

Looking at the first asset store asset, they mention “webgl(chrome, firefox) use third party server to get the video urls”. So what that means is that they work around Google’s official video player widget by ripping the videos onto a transparent proxy server that they host somewhere.

The second asset store package does not mention their details. I presume they will be doing something similar.

Searching the web, it looks like developers of Google’s Chrome web browser prototyped a solution for this six years ago, at GitHub - toji/webgl-iframe . However running the code today does not work (and looks like it never worked in public Chrome, but only in their internal test builds). In Uncaught TypeError: gl.bindTexSource is not a function at bindIFrame · Issue #2 · toji/webgl-iframe · GitHub they mention

"
This project only worked with a locally-patched prototype version of Chromium, but we are no longer working on it. I don’t think we will ever add this support in Chromium.
"

It does seem like the video proxy solution from asset store package 1 would be the straightforward method, if the asset store package author can help make it work. But do check YouTube’s licensing and ask the asset store package author about licensing to make sure the mechanism is adhering to YouTube’s licensing.

3

Hey, you’re in luck, because I got bored this week and made a free thing to do exactly this:

3 Likes
4

Hi, I tested your example and the important thing is that it works in WEBGL, but could you create a simpler example. One without the player moving. Just a VideoPlayer
Because I had difficulty replicating your model. When I tried, my video had no sound and was upside down. Thanks

1 Like
5

Hey,
Playing YouTube videos outside of the YouTube app is against the rules.
At HISPlayer we have solution to upload and host your videos and generate HLS and DASH streaming URLs. Hopefully it helps.

6

Works very well. But can you make an improvement that will allow the playing on other surfaces besides a quad? Actually I can get it to play on other surfaces but it just projects a flat rectangle even on a sphere.

7

Like what surfaces?
I’m pretty sure the answer is no due to the limits of 3D CSS transformations, but depending on what you need you might be able to fake it to some extent.

8

Thanks for the quick reply. A sphere. If I could display a YouTube video on a sphere it would serve my purposes. Like i said i can display it onto the sphere it just displays as a rectangle and does not map like I can when I use the stock Unity Video player. The stock video player will display nicely on a sphere but will only do an .mp4 or a video file.It will not do a YouTube file.

9

Not possible, I’m afraid. You can’t access the youtube iframe’s pixel data to use it as a texture.