CODEWITHSUNDEEP
youtube-api
Scott Witte
Scott Witte

Reputation: 389

Embeded Youtube video not playing locally, fine when online

When I embed Youtube video on a page and test it locally nothing happens or the browser even locks up, depending on the browser. Publish the page, test online and it works fine. Obviously not an ideal develop/test scenario. I'm using the iframe embed code from Youtube.

It sure seems like a cross domain security issue but I see no errors using Firebug and haven't found any reference to that nor anyone with a similar problem. Probably just missing something but I'm stumped. I don't like being stumped... for long.

Example that works online but not locally even if this is the only code in the body:

<iframe width="640" height="360" src="//www.youtube.com/embed/INg83kArY4g?rel=0" frameborder="0" allowfullscreen></iframe>

BTW, no problem embedding and playing the same video locally when hosted on my own web server (not locally). Any help would be appreciated.

Upvotes: 2

Views: 4587

Answers (2)

makenova
makenova

Reputation: 3645

The reason that file will not load locally is because you are using a protocol relative URL when defining the src attribute. When the browser parses the src it will prepend the scheme(http: or https:) that the page is viewed in. If the page is being viewed locally, your browser will prepend file to the URL and that will result in an invalid URL.

You can remedy the issue by inserting a scheme on the src e.g. 

src="http://www.youtube.com/embed/INg83kArY4g?rel=0"

or by serving up that page on a local server.

Reference
Paul Irish

Upvotes: 3

Carl Edwards
Carl Edwards

Reputation: 14434

Try adding 'http:' to the beginning of the src attribute:

<iframe width="640" height="360" src="http://www.youtube.com/embed/INg83kArY4g?rel=0" frameborder="0" allowfullscreen></iframe>

Upvotes: 0

Related Questions