Hello Php Programmers,

I want to open iframes, more than one, to some of my webpages from other webpages.
What do I need to be careful off so no crook injects anything malicious on my site or on my visitors' clientsides ?

Q1.
Which of these attributes, mentioned in the tutorial, do I need to add or ignore on my iFrames for the sake of preserving security so no holes popup ?

allow
allowfullscreen
height
loading
name
referrerpolicy
sandbox
src
srcdoc
width

https://www.w3schools.com/tags/tag_iframe.ASP

Bear in mind, I won't be using Javascript on my website or iFrame pages.
Only html, php and maybe css.

I know this is lame for security purpose:

<iframe src="https://www.w3schools.com" title="W3Schools Free Online Web Tutorials">
</iframe>

Same question goes for if I want to open iFrames to third party sites and I do not want to jeopordise security on my end, visitor's end or the site's end to where I open the iFrames to. I must have security intact. Do not want other sites getting harmed or my website visitors getting harmed by internet malicious crooks due to my insecured iFrame codes and find myself getting sued left & right.
How would you code the iFrames on both cases.

Recommended Answers

All 26 Replies

Q2.

And, which of these attributes, mentioned in the tutorial, do I need to add or ignore on my iFrames for the sake of preserving security so no holes popup on my iframes that open to my own pages ?

allow-forms
allow-pointer-lock
allow-popups
allow-same-origin
allow-scripts
allow-top-navigation

Same question goes for opening iFrames to theird party sites.
Again, bear in mind, I won't be using Javascript on my website or iFrame pages.
Only html, php and maybe css.

Q3.
Mmm. How-about we see how you would do the codings yourselves. :)

I know some websites foil you opening their pages on iFrames. How to foil their measures ?
Is this the answer ?

iframe srcdoc

Q4.
Why this Sand Box code fails ?

<iframe src="http://ebay.com" sandbox>
      <p>Your browser does not support iframes.</p>
</iframe>

I see iframe opening to a blank white page.

Q5.

Is it possible to get iFrame auto edit text before opening the iFramed page ?
Eg. Let us say, dani.com/forum has the text 'Dani's Forum' on the page and I want to have the word/text 'forum' changed to 'message board'. Now when the page loads in the iFrame, the following text should not be shown:

'Dani's Forum'

But get shown instead:

'Dani's Message Board'

Same question goes for changing links.
And changing parts of the html or css code or even javascript in the iFrames page.
Changes can be made based on regex pattern. Yes ?

Q6.

I read now thios benefit about Sand box:

"Unique origin treatment. All content is treated under a unique origin. The content is not able to traverse the DOM or read cookie information.
This means that even content coming from the same domain is treated with the cross-domain policy, as each IFRAME content will be viewed as a unique origin."

https://www.htmlgoodies.com/news/html-iframe-sandbox/

But, I really do not think opening iFrames to my site's own pages would be a security issue. And so, not bothering with the SandBox on this case.
What do you say ?

Q7.
This is very puzzling!
I read ....

**allow-same-origin

By default, an IFRAME page from the same domain has the possibility to access the parent’s document object model.

With the sandbox attribute in place, the page will be treated as not being from the same origin. This page has no access to the resources, even when coming from the same domain.

To re-enable same-origin treatment in a sandboxed scenario, you have to specify the allow-same-origin attribute.**

<iframe sandbox=”allow-same-origin” src=”xyz.html”></iframe>

**The value itself is not very helpful, as you need some script capabilities to make use of it.

For example, if you want to access the local storage of the current domain like this:**

   function loadFromStorage( key ) {

    if( localStorage ) {

           return localStorage.getItem( key );

    }

  });

…you also need the allow-scripts value:

<iframe sandbox=”allow-scripts allow-same-origin” src=”xyz.html”></iframe>

**Now access works!

But be warned: Allowing multiple scripts in the same sandbox can lead to security vulnerabilities. For example, your hosted content can manipulate the attributes of the sandbox and remove further restrictions.**

My question is, why is it security issue when I am opening the iFrame to another webpage of mine on my same website ? Obviously, I won't have malicious codes on my iFramed page to damage or steal things of my page that is opening the iFrame. Now would I ?
So, what is the big fright-issue here ?
I do not understand!
Question arose after reading the Sand Box's 'allow-scripts' section here:
https://www.htmlgoodies.com/news/html-iframe-sandbox/

Q8.
On the Sand Box, if you want to allow more than one attribute then how you write it ?
Like this ?

  <iframe src="login_Template.php" sandbox="allow-forms" sandbox="allow-scripts">
  <p>Your browser does not support iframes.</p>
  </iframe>

Or, like this:

<iframe src="login_Template.php" sandbox="allow-forms;allow-scripts">
<p>Your browser does not support iframes.</p>
</iframe>

@dani

I hope I did not open this thread in the wrong category. If so, kindly transfer it to the approp[riate section.

Andyway, do you have enough secruity knowledge about iFrames ?
(Frankly, I think you do cos you Javascript expert).
So, what is your advice on this subject, if any, if you do not mind me asking ?

Btw, "Boro Bhaisab" means "Big Brother" (oldest brother) in the Bengali language. Big Bro. Or, even "Greatest Bro"!
On other parts of the Indian Subcontinent (India, Pakistan,Sri Lanka, Nepal and maybe Bhutan too), just pronounce "borO" as "bor-E" or "borA".
It just occured to me what Username I using here and so thought it's best English Speakers actually know what it means and how they are addressing me as. Lol! "Big Brother"!
No. Not the "cop" big brother. Lol!
Ironically, I am also the oldest sibling and oldest cousin amongst many of our maternal & paternal families. Lol!
So, Username fitting me well. I might even be the oldest in this forum. Actually, not. Only in my mid 40's. But probably older than you. ;)

The forum's Big Bro! Lol!
Unfortunately, not a Big Bro in programming yet.

Programmers,

What is the issue about allow-top-navigation and not allowing it in the Sand Box ?
What harm can it do if allowed or disallowed ? I do not understand the risks involved.

A lot of what you have written here is beyond what I'm familiar with since I haven't used iframes in well over a decade.

However, let me start with first thing's first: What is your goal in including iframes for pages on your website on your website? The typical use case for iframes would be to include third-party content embedded in your site, and that's when there's lots of security vulnerabilities you need to be careful of. If you have 100% control over the content in the iframe as well as the content hosting the iframe, then I don't see much of a security concern (perhaps there is and I just don't know about it), although I don't quite see the point? Iframes might not be the best tool for the job.

Also, to the best of my knowledge, there is no way to edit text or content within an iframe that you don't have control of. For example, you can't load daniweb.com in an iframe on your site, and change content in the iframe to say BoroWeb instead.

thats why i prefer wp and plugins

commented: What has that got to do with iFrames ? +0

@Dani

Imagine your profile page is showing in one iFrame a SERP that lists all keywords you searched.
And another iFrame showing your latest viewed propfiles of other members.
There are a lot of reasons to use iFrames.

A website can accomplish the same functionality without iframes, through a combination of API calls and Ajax, both of which didn’t exist back when iframes were first used.

@Dani

Reading this tutorial now but I deem I will not understand 75% of it as I not experienced techno like you.
If you interested to brush up ion iFrame security then be my guest to read it as I think I can later-on make use of what you understood from it that I did not understand reading it.
https://blogs.halodoc.io/iframe-security-threats-and-the-prevention/

Reading the link above, I understand I do not have to take any precautions to load other pages of my own site on iFrames loaded on my pages.

@dani

Ah! But let us say, I write a searchengine where the SERP does not list search result links like the traditional searchengines but actually goes and just opens the search result links via iFrames.
So instead of showing 10 SER Links per SERP, it shopws 10 iFrames opening to the 10 SER Links (search result links).
Now my SE (searchengine) cannot be dealing with millions of APIs and the like. Now can it ?
Imagine Google dealing with 1 billion websites' 1 billion APIs and Ajaxes.
That was just one typical expample why I would want to use an iFrame.

Again, a good reading Dani:
https://blogs.halodoc.io/iframe-security-threats-and-the-prevention/
Just read it. Now reading the other links it linked to.
If you free, do read them.

Thanks!

So instead of showing 10 SER Links per SERP, it shopws 10 iFrames opening to the 10 SER Links (search result links).

This is a very poor experience for the end user because their web browser would need to simultaneously load ten pages at once.

Now my SE (searchengine) cannot be dealing with millions of APIs and the like. Now can it ?
Imagine Google dealing with 1 billion websites' 1 billion APIs and Ajaxes.

Google's crawlers do that.

Also ... I think I misunderstood you before. I had thought you had mentioned in another thread that the content in the iframes was going to be hosted on your server, which is why I suggested using an internal API instead. If your plan is to load other people's websites into iframes, I think that you're going to have a very hard time doing that nowadays. Most security-conscious websites implement the X-Frame-Options HTTP header or CSP frame-ancestors directive which both block them from being able to be loaded inside an iframe. We do it here at DaniWeb.

Imagine your profile page is showing in one iFrame a SERP that lists all keywords you searched.
And another iFrame showing your latest viewed propfiles of other members.

I think most people would consider it an invasion of privacy for other people to see what they were searching for.

commented: Also, that Bro Code: Delete my browser history when I'm dead. +0

@dani

How come I am unable to reply to each of your posts individually on on this forum, like other forums ?
And, if it is not too much to ask or too much a bother then may I see a copy of the code you use to secure your site's pages from opening in iFrames ? This should give me an idea what measures websites take.
You said:
"If your plan is to load other people's websites into iframes, I think that you're going to have a very hard time doing that nowadays. Most security-conscious websites implement the X-Frame-Options HTTP header or CSP frame-ancestors directive which both block them from being able to be loaded inside an iframe. We do it here at DaniWeb."

@dani

Frankly, you can check if the html5 has updated any iFrame attributes in the last dacade or not.
Here you go:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-sandbox

I read through all the iFrame attributes and most of their descriptions I did not understand, I am afraid.
Hence, just gonna use code like this for security purpose by Sand Boxing everything when opening iFrames to third party websites:

<iframe src="http://third-party-site.com" sandbox>
      <p>Your browser does not support iframes.</p>
</iframe>

And, I will use following to open iFrames to my other pages:

<iframe src="http://mysite.com">
      <p>Your browser does not support iframes.</p>
</iframe>

This is very very odd!
I have page on my local host: iframe_Test.html.
The page has iFrame code opening to: register.php.
This following code prevents the Register Form from working:

<iframe src="register_Template.php" sandbox="allow-same-origin" sandbox="allow-forms">
  <p>Your browser does not support iframes.</p>
</iframe>

However, rearranging the code does not prevent the form from working!

<iframe src="register_Template.php" sandbox="allow-forms" sandbox="allow-same-origin">
  <p>Your browser does not support iframes.</p>
</iframe>

Strange! How so ?
Both files are on the same directory. The page that has the iFrame and the page that is the src of the iFrame.
This beats me! Puzzling!

Borobhaisab, why do you wish to steal other peoples' work and display it on your own website, after editing some parts of the content, such as the name of where you got the content from? This is theft of someone's copyright work. That's why many sites have code to prevent content being shown in iFrames.

If you are trying to display some part of your own site, why not just provide a link? Or a link to the true content provider's site?

Content placed on the web is NOT public domain unless it contains a specific statement that it is pubic domain (such as often happens with images placed on wikipedia). Nor does content placed on the web need to display a copyright notice. You take a picture with your camera - it is automatically your copyright, you right a review on your website, or for your school magazine, or club newsletter, it is automatically your copyright. But a review can legally contain a small abstract, or quote or similar from whatever you are reviewing. And someone else can quote a sentance or two from your review in their own review, as long as the original source is acknowledged.

Copyright notices in books or image sources are to let you know who will be taking you to court, to prevent someone else trying to take payment from you so you can use it, and so that if some of the content is actually stolen, the real owner knows who to come after with their lawyers.

So, why are you really so interested in iFrames and editing the true title/source out of pages you display? Especially as I can simply look at the page source code and see the iFrame and the true content owner???

How come I am unable to reply to each of your posts individually on on this forum, like other forums ?

Some forums are threaded, which means you can reply to individual posts and create multiple threads for each topic. DaniWeb's forum is flat, meaning each discussion topic is just one single thread.

And, if it is not too much to ask or too much a bother then may I see a copy of the code you use to secure your site's pages from opening in iFrames ? This should give me an idea what measures websites take.

This is accomplished with an HTTP header. There are two HTTP headers that you can use. One is through the CSP (content security policy) as such:

content-security-policy: frame-ancestors 'none'

Content security policy supports many different security settings, many of which are beyond the scope of answering your question, as entire articles can be found on the web about CSP. Having a CSP is highly recommended nowadays.

The second way is with x-frame-options, although this method is more obsolete in favor of using the more robust CSP instead:

x-frame-options: DENY

In PHP, you would do one of the following:

<?php

    header("content-security-policy: frame-ancestors 'none'");
    header('x-frame-options: DENY');

That would send the HTTP headers to the end-user's web browser, and their web browser would then know never to render the page in an iframe.

Strange! How so ?
Both files are on the same directory. The page that has the iFrame and the page that is the src of the iFrame.
This beats me! Puzzling!

This is happening because the <iframe> tag can only have one sandbox attribute. When you have two sandbox attributes, the one appearing first in the code overwrites any later ones, to the best of my knowledge. Either way, it's invalid HTML, so I can't speak for what unexpected behavior you may encounter.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.