I’m having an issue with YouTube embeds on my Netlify site. I’ve done some research into this and I think the problem might be to do with the referrer policy enforced by Netlify but I don’t know enough about this to be able to fix the problem.
When I visit the site, I get a “video unavailable” on all embeds. I’ve confirmed that these are allowed to be embedded, and besides they previously worked fine a few months ago but the client I built the site for is now reporting that they’ve stopped working.
(scroll about half way down)
I use Sanity to manage the content and the same embedded video in the Sanity Studio plays fine. It’s only on the actual, Netlify hosted, site where it won’t play.
Here’s a screenshot of my localhost working fine:
From the research I’ve done it looks like YouTube require a less strict referral policy such as “no-referrer-when-downgrade”.
This is a bit of a strange one, it seems. Whenever I embed the file using Netlify Dev (so a local emulation of the Netlify platform) I get the same error. When I run my site without Dev, it works ok. I tested a couple of other random videos. Some work, others don’t. No errors in console, no blocking plugins etc.
I think you can have more luck by posting it on some other forums too like StackOverflow or Google’s forums. If some of them are able to point this out to an issue from Netlify end, we can find a solution for that, because at this stage, it’s producing mixed results for everyone, thus hard to debug.
Thanks for the response @hrishikesh — I’ll try posting this on Stack Overflow like you suggest (I’ll edit this post and link it here when I do).
It’s worth pointing out that I tried deploying this website to Gatsby Cloud, and the same page loaded on their platform doesn’t suffer this issue (it’s deploying the exact same branch).
As @coelmay suggested above, if it’s really a headers thing, you could configure custom headers and try. But as to what the headers would actually be, that might be answered on the other forums that I mentioned.
Furthermore, I doubt this really being a server issue as many users are displaying YouTube videos on their websites without issues. If it was a server issue, maybe they’d have got affected too. But yes, as we’re out of ideas, maybe someone else could point out as to what server-specific config might be causing this and we can then work a fix accordingly.
Hi, @Jomoka. If you post a link to the page where the embedded youtube video doesn’t work for you we would be happy to take a look.
There isn’t anything at Netlify that would prevent this so I do suspect the solution had to do with a change to the site code and not a change at Netlify.
My solution in this instance was to disable certain security headers in Netlify. I didn’t use a plugin, but the one you linked sounds like it worked for you.
Hey, all. This started happening on one of our sites after upgrading to Gatsby 5. I have no idea why, but what seemed to resolve the issue for us was setting referrerpolicy="no-referrer-when-downgrade" in the iframe element. Setting mergeSecurityHeaders: false in gatsby-plugin-netlify options had no effect.