Embedded YouTube video doesn't work on local server

Question

I saw many questions like this asked on StackOverflow, but none of them had a working answer. My problem is that I can't embed a YouTube video, because a "This video is not available." comes up:

Here's what I know and have tried so far:

• This error doesn't come up on all videos. From what I've noticed, it's mostly not working on popular music videos.
• Embedding these YouTube videos doesn't work in a local HTML file (file:///C:/path/to/file.html) nor when the embedded video is on my local Django server (12.345.67.89:8080/page).
• It doesn't work both with Youtube's IFrame API and simply an <iframe> copy-pasted from YouTube:
• I tried both /embed/ and /watch?v= as the URL.
• When using the iframe, changing https:// to http:// or // doesn't work. Taking the www. part out doesn't work either.
• Interestingly, it does work when I put the code in JSFiddle.
• It doesn't work on both Chrome and Firefox.
• There are no errors in the console.
• Accessing the website from my phone (not connecting from my WiFi) or a web proxy doesn't work either.

Polyhydric

Do you get any errors in console? – Imphal

When running in Firefox with all extensions disabled on a local server, there's no errors. – Polyhydric

"Interestingly, it does work when I put the code in JSFiddle." The embed in the JSFiddle link doesn't work anymore as of June 21, 2020. – Caliche

@Caliche still does for me – Polyhydric

@MarkedasDuplicate it doesn't on my end. If you actually press play, it says "video unavailable". i.imgur.com/Z680hpK.png – Caliche

In some cases problem may be in Referrer Policy. I got an error with some videos when Referrer Policy header was set to same-origin – Lapel

Answer 1

Sergiy Shcherbina's answer helped me solve this issue. I was running my web server from a vm and accessing it through my local IP address.

It seems that you need to access your page that contains the embedded youtube player through a host name and NOT an IP address.

How I solved This for my dev environment

Before the change, I was accessing my web-page like this: http://192.168.x.x:3000/video and i would get 'video unavailable' errors for many videos that were verifiably 'embeddable'.

A Hacky word-around: I set a hostname for my VM in my hosts file and aliased my IP address to dev-vm. How to edit your host file

Now i access the page which has my embedded player like this: http://dev-vm:3000/video and now videos that previously gave me a 'video unavailable' error are now playing.

What a bizarre issue. I hope this helps some people who are having a similar issue.

Fatality

I think i have the same issue but the embedded videos runs on iOS App – Exorable

Same issue happens on mobile Safari too. I was getting it when trying to test my web app from my phone using the direct IP of my localhost dev server. So the fix in a MacOS environment is to access the dev server via the http://<name>.local method. The computer name is in the Sharing panel of the System Preferences. – Mattoid

I'm accessing my Django website with : http://localhost:8000/ but it doesn't work! any idea? – Dinitrobenzene

Answer 2

It works on sites with domain and does not work on sites reached by IP adress. Works when using on "localhost" and causes "The video is unavailable" when using "127.0.0.1". This is really strange...

Sosa

But why it doesn't even work when directly accessing the embed page by using the YouTube domain like following: youtube.com/embed/9bZkp7q19f0 – Assegai

@SergeyMell While this might not have been useful as an "answer" it was still a VERY helpful comment/observation. So thanks to Sergiy Shcherbina for adding this "answer"/comment!! – Chemical

Answer 3

For some god-forsaken reason, known only to YouTube's engineers, some videos require an HTTP server to play.

If you're familiar with npm and Node.js, you can follow the instructions here so you can set up an HTTP server and try it out for yourself.

But please, if you do have the time and willingness, send a bug report about this issue by following the instructions here. This sort of issue should definitely not be happening.

Best of luck!

Authentic

Answer 4

This is not Youtube APIs fault. Tried running this on my localhost using "python -m SimpleHTTPServer 8080" and got it running easily. So, I'm concluding that you don't have a proper local web server. Also, "file:///C:/path/to/file.html" will never work because to use any of Google APIs, you need to have access to the internet.

Ladd

only fails for some videos, eg youtube.com/watch?v=8EzdmE4Ewqk – Meyer

Answer 5

Interestingly, I had a similar issue, but the opposite -

My youtube embed was working on my local dev server (http://localhost:8000), but when I opened the same page on production (eg https://example.com), I'd get "video unavailable" with no useful logs.

I believe I found the answer on a YouTube Community Support Thread:

James Peters 4580:

Actually found the issue here. The videos that were displaying this on embed had "Copyrighted" music playing in the background. YouTube apparently does not play videos like this while embedded. We had our user remove the audio and re-uploaded the video and everything is working fine now.

Hope this helps somebody.

The video I was embedding had music in the background, so I tried a random video from some youtuber's channel, and that video worked.

If anyone is having this problem (works on localhost, fails on an actual domain / behind https), it's possible that youtube is quietly blocking your embed for DRM reasons.

Pottle