I have an iframe that shows a website on another domain that has links in it that have target="_parent" attributes. So instead of loading the link in the iframe, it redirects the whole page. Is there a way to catch this event, cancel it, and set the iframe's url to that link using jQuery or just straight javascript?
With browsers that support it, the best you could do is to use the sandbox-attribute:
<iframe sandbox="allow-forms allow-scripts allow-same-origin"></iframe>
The iframe is not allowed to change the top location now unless you list "allow-top-navigation" in the attribute.
But instead of the link working in the iframe, the links don't work at all and a security error is logged in console:
http://jsfiddle.net/rRT6S/3/
Related
How can I make it so that when I click on another page in an iframed it opens within the iframe? I own both the website being iframed and the site with the iframe, so if I need to do something with the configuration of either that is fine. Thanks for your time!
That is the default behaviour.
So don't:
Use JavaScript to trigger non-standard link behaviour
Use a target attribute on the link
Use a target attribute on a <base> element
Use an CSP to block the page from being loaded in a frame
Use an X-Frame-Options header to block the page from being loaded in a frame
On the site that you are embedding the iframe on, enter this code:
<iframe src="Your iframe url" width="100%" height="100%" name="search_iframe"></iframe>
On the site within the iframe insert this code, and make sure the url is the other link you want to redirect to in the iframe:
<html>Link_name</html>
This should let you redirect in an iframe, but remember to add the href code for each link, otherwise it will open the link outside of the iframe.
I'm using iframe to open a website in html.
However, many target attributes are _blank and _top in the website.
Therefore, the pages always open in a new window.
How to force the link open in same inframe in html?
My code below:
<iframe name="inapp" frameborder="0" src="http://www.w3schools.com" target="_self"></iframe>
I'm afraid you can't if you are embedding a page from another website. There's strict cross-domain security measures in browser to prevent your page from accessing the contents of the iFrame.
If you have control over the underlying page, then that's different, but I guess you wouldn't have the target issue in the first place.
I have an iframe pointing to an external link that does some redirections as soon as the iFrame loads. This causes added history into the browser and also when users click on links inside the iframe.
This causes a weird user experience because you have extra back history states pointing to the same parent page.
I was wondering if there was a way to prevent the iframe from ever adding history to the browser?
Since the link is external, the short answer is no. If you are in control of the content of the iframe there are a few things you can do. History will be updated any time the src attribute of an iframe is changed after it has been added to the DOM or if the user follows a link in the iframe. With control of the iframe content, when a user clicked a link, you could use postMessage and have the parent window replace the iframe element with a new one. In the same domain, you could just use window.parent.
You can try to use sandbox="" attribute to prevent the iframe from redirecting.
<iframe src="http://example.com/" sandbox=""></iframe>
There is no way to clear the session history or to disable the back/forward navigation from unprivileged code. The closest available solution is the location.replace() method, which replaces the current item of the session history with the provided URL.
Source (MDN)
location.replace() | MDN
http://jsbin.com/coregedoze/2
Here is a link of my code with an iframe, this has no sandbox attribute- as this attribute only works with HTML5 and limited browser version. I rechecked this code and it wont save any history. Only case is if you change your source of the iframe the whole page reloads and makes another entry into history, which can be avoided using sandbox="value" as mentioned in above answer by JAYDEN LAWSON. Another way around is declare your links in your page out of iframe and call them in iframe like traget="iframe_a" , where iframe_a is your iframe name. hope this helps :-)
No, You can do almost nothing with an iframe which has src set to another domain because of XXS
I am working on a web application.
In this web application I have to load a web page from a different servers(Eg: www.xyz.com) in an iframe. But sometimes when I try to load the web page from some different server in the iframe the server responds with HTTP status code 302 (stands for redirect) with the redirect link in the Location header field. When this happens the main window(my web app) is redirected instead of redirection happening only in the iframe. How can I ensure that the redirection happens only in the iframe instead of the main window?
Use sandbox="..."
allow-forms allows form submission
allow-popups allows popups
allow-pointer-lock allows pointer lock
allow-same-origin allows the document to maintain its origin
allow-scripts allows JavaScript execution, and also allows features to trigger automatically
allow-top-navigation allows the document to break out of the frame by navigating the top-level window
Top navigation is what you want to prevent, so leave that out and it will not be allowed. Anything left out will be blocked
ex.
<iframe sandbox="allow-same-origin allow-scripts allow-popups allow-forms" src="http://www.example.com"</iframe>
The issue is not about your redirection, but about what happens before: I suppose the user is submitting a form, through POST, and the webserver replies a 302 redirection as per best practice.
If a <form> has an action attribute pointing to another page, its answer will redirect the top iframe. I couldn't find any reference document stating that behavior, but that's how it works in current browsers.
The solution is to set the target attribute to _self:
<iframe>
...
<form action="http..." target="_self" >
...
</iframe>
The sandbox attribute won't help here, you likely want to omit the attribute or to set allow-forms allow-navigation at least.
It works for me when I set target="iframe_name".
My site is laid out like this:
{main page (iframe containing flash ad) }
Sometimes malicious flash ads load in the frame and redirect the user to a site of their choosing. I imagine they use the getURL() function in actionscript.
As I own the top page as well as the page inside the frame and am therefore able to edit the html for both is there anyway of preventing the flash ad from sending requests through the iframe to change the top location.
Any help would be appreciated.
Thanks.
HTML5 to the rescue!
Just add this to your iframe:
sandbox="allow-scripts"
This iframe sandbox feature prevents anything in the iframe from redirecting the page or performing any top frame navigation.
The one value you want is:
allow-scripts - Allows script execution
The other three sandbox options you don't want are:
allow-same-origin - Allows the iframe content to be treated as being from the same origin as the containing document
allow-forms - Allows form submission
allow-top-navigation - Allows the iframe content to navigate (load) content from the containing document
Fully 'sandboxed' iframe:
sandbox=""
Fully capable iframe:
sandbox="allow-scripts allow-forms allow-same-origin allow-top-navigation"
(or simply omit the property)