Youtube https embedding causes warning in Firefox

Question

I'm working on a site that requires a login and includes embedded Youtube videos. Because of the login, I need to get SSL working, which it largely is. I'm hitting an unexpected problem with the Youtube embeds, though. It's easy enough to point at https://www.youtube.com, but Firefox still complains that there's unencrypted content on an encrypted page. According to Firebug, the only unencrypted load was from http://[stuff].youtube.com/videoplayback?[more stuff].

Now, it's perfectly understandable that Youtube doesn't want the overhead of encrypting their video streams, and I don't think that this poses an actual security vulnerability. I just need to keep the browser happy. (I know that that warning can be disabled, of course, but I can't do that on my users' machines.) There must be a way to do this, because https://www.youtube.com itself doesn't make this error pop up, even though it uses http: for the video streams, too.

I have not seen similar errors in other browsers, but I haven't looked very hard just yet.

If it matters, my development machine doesn't have a valid SSL certificate; I just added an exception.

Alterant

Somewhat similar question: #14440150 – Neilla

From YouTube help: "It is important to note that while embed components are all supported using HTTPS and do not generate the mixed content error, we do not yet support video streams over HTTPS." support.google.com/youtube/bin/… – Neilla

Yeah, I saw that, and I'd think that there's nothing to be done, except that Youtube itself doesn't have this issue. It's possible, I suppose, that it's only fixable when the unencrypted content is on the same site as the host page, i.e. when not embedding content. – Alterant

I suppose YouTube uses a completely different technique to embed the video on the page on youtube.com compared to the embedding options available to the public. At least the final embed code is quite different on youtube.com (src, flashvars etc., inspect with Firebug) than what you see elsewhere. – Neilla

Answer 1

If you are using <iframe> use <embed> or check other embedding code options that YouTube API provides.

Milner

Answer 2

I have a ssl secured website and this works for me in Firefox

<iframe id="player" src="https://www.youtube.com/embed/XfI....Ctpo?enablejsapi=1&origin=https://yourdomain.com&showinfo=0&iv_load_policy=3&modestbranding=1&theme=light&color=white&rel=0" frameborder="0"></iframe>

Amor

Answer 3

I don't have a solution, but a suggestion instead: Are you sure not having a valid SSL certificate couldn't have something to do with this? You wouldn't think so, but you never know. If you get one, and it still doesn't work, it's not something you wouldn't have had to do anyway. I went through the process of obtaining/installing and configuring SSL key(s) and certificates for my home server, and every little thing seems to have an impact on how SSL acts/reacts.

Also, have you tried accessing the site outside of the local network it's on? It sounds like you're on the same network as the server which is hosting the site (the one that has SSL installed), which can create problems itself because of NAT traversal (I believe, but correct me if I'm wrong - we're all here to learn). Sometimes with HTTPS, you can have a problem connecting to resources within the local network, that people on the internet would have no problem at all connecting to. Just my two cents.. and sorry for any incorrect info, if I provided any. Take this all with a grain of salt, but hopefully you'll find the answer to your problem. Things like this can be a pain in the rump.

There may not be anything you can do about this, also.. because Youtube seems to not provide content over HTTPS... which is out of your control. I know you don't contest the error you're being given, and just want a workaround, however.

BTW, I think their homepage is HTTPS enabled, just not their video content...so that's why embedding the homepage wouldn't produce the error.

EDIT: Also, I see someone else wrote to use embed instead of iframes, which I would also recommend. The browser treats iframes like another page, but the error your getting indicates the unsecure content is actually combined with the secure content, so everything should be fine with that... but you never know.

Oneill

Answer 4

Try the page with the Firefox "inspector / network ananlysis" (shift-ctrl-I) to analyze what elements are requested. I guess it's some javascript INSIDE the that you don't have under your control. In any case you should be able to pinpoint the specific trigger with this tool.

Check wheter it makes a difference when switching your browser to HTML5 instead of Flash for the video or vice versa. YouTube recently changed the default protocol to HTML5.

Literator

Answer 5

Please remove http then u check..

for example

<iframe id="player" src="www.youtube.com/embed/XfI....Ctpo?enablejsapi=1&origin=https://yourdomain.com&showinfo=0&iv_load_policy=3&modestbranding=1&theme=light&color=white&rel=0" frameborder="0"></iframe>

Bayberry

Answer 6

It is an old thread, but this is my solution for opening the video in a pop-up, without warning from Firefox.

The link I used before, it is the link from YouTube : https://youtu.be/L5CrXP7z6KY?si=4wAum15oVXmt6m-e With this link, it doesn't give me an error. : https://www.youtube.com/embed/L5CrXP7z6KY

Perceivable

Answer 7

Is it possible by your website design that you could try fetching the youtube videos by an http call instead of an https? I don't know the layout of your site, but if you're just wanting it to stop complaining, that should do it.

That said, youtube DOES have valid https certificates, but that's due to the google integration. Since you aren't google, you wouldn't read as the valid certificate holder when accessing youtube's content (that's the exact kind of thing SSL's are meant to guard against).

So, basically, if you can, just embed via http instead of https. YOUR site can still be https, just not the call to youtube.

Medievalism

Answer 8

just remove ( http or https ) with colon, it will work perfectly

example

<iframe id="player" src="//www.youtube.com/embed/XfI....Ctpo?enablejsapi=1&origin=https://yourdomain.com&showinfo=0&iv_load_policy=3&modestbranding=1&theme=light&color=white&rel=0" frameborder="0"></iframe>

Fletcher

AlienWebguy gave exactly this answer years ago. It didn't work for me then, and... come to think of it, YouTube hasn't been sitting still; it actually might work now. Haven't tried in ages. – Alterant

This will match the iframe request scheme to the scheme used to load the page. If the YouTube iframe explicitly loads anything over http, you'll still have the mixed content issue. – Gemoets

Answer 9

A much simpler way to do this is to download the video itself and then link to it locally on your server e.g save it in the same directory as your page and then just link to it there.

Bastien

While that would work if we were just talking about one or two specific videos, it's totally impractical for my specific application. I'm pretty sure it also introduces copyright issues that simple embedding skirts around. – Alterant