Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to allow iframe embedding only for whitelisted websites?

I've a form that I'd like to embed in a website, which is on my whitelist.

Other websites, that try to embed it, should get only an error page.

<iframe src="https://domain.tld/getForm.php?embed=1&formId=123456"></iframe>

I was hoping that I could use $_SERVER['HTTP_REFERER'] in getForm.php to check the embeding website, but it's not working.

Does anyone know a best practise or any workaround?

Thanks in advance!

like image 626
Mr. B. Avatar asked Sep 14 '16 05:09

Mr. B.


People also ask

How do I allow a website to be embedded in iframe?

Step 1. Go to the page or item you would like to share, choose the Embed option, and copy the code. The following image uses a YouTube video as an example. If your site does not have an embed option, you can get the code by going to Embedly and pasting the URL like so.

Which is better iframe or embed?

In general, IFRAME is currently the most populat tag, and EMBED is supposedly being deprecated. The three tags can handle video, but here it is generally better to use the VIDEO tag, as the was created specifically for this particular use. You can read more about video on websites here.

Why is iframe not allowed?

You cannot bypass embedding sites like google in an iframe because they add x-frame-options headers (deny or sameorigin). Browsers that support those headers simply won't allow it. If you just need to get data from a page and show it, you could get the data server-side, but this is probably not your intentions.

How do I create an embeddable iframe?

To embed an iframe in a content page, select Interactive layout, choose the HTML block and paste the iframe code there. You can adjust the iframe width and height properties. To embed an iframe using the Old (Classic) editor, click on the Embed Media icon and paste the code in the appropriate field.


1 Answers

Content Security Policy headers are now the recommended approach.

Example from MDN:

// iframe can be embedded in pages on the origin and also on https://www.example.org
Content-Security-Policy: frame-ancestors 'self' https://www.example.org;

For more details see: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors

like image 88
Josh Mc Avatar answered Sep 27 '22 20:09

Josh Mc