I am facing this weird issue when working with iframes.
I have a page(jsp) based on spring portlet framework which I want to render in an iframe. I made a dummy iframe and it was working perfectly fine in both IE(iE11) and Chrome when i was testing with my local server. However once the code got deployed to the dev server, the iframe renders the first page in IE, but does not render the next page on click of a button on that page. It is still working perfectly fine in chrome. I have no idea as to why that is happening.
Here is the code for my dummy iframe :
<html>
<head>
<title>IFRAME DEMO</title>
</head>
<body>
Forgot Username
Forgot Password
<iframe src="" width="82%" height="800" name="sampleFrame">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>
After reading some oldthreads, I figured out that I need to add the domain to the trusted site of IE and that solution worked. However this iframe will be exposed to the end user and I cannot expect every user to change this setting. Can we enforce it at server level somehow ?
Related
My site is using Angular 10 (With server side rendering). I referred to https://angular.io/guide/universal to convert the site into SSR. Everything is working fine. 'View Source' shows me the content, I can share with Social Media. My node server does not give me any error.
The only issue I am facing is - When it is rendered through the node server, it shows as HTML string. For few seconds user sees below:
<!DOCTYPE html> <html> <head> </head> <body> <h3>Step 1 - Add environment variable </h3> <p> ......</p> </body> </html>
Later it switches back to properly formatted HTML. The same is the case with material icons used on site. I see them as strings initially.
Please check out the link https://ecokrypt.com/dashboard/article/detail/5e59df2b00190207e65d9e99/4.3---Angular%253A-Consider-Different-Environments
Slow network throttling shows the issue clearly. This is giving a very bad end-user experience. Am I missing any step in SSR? How can I handle this? I tried to search this issue on google, but no luck.
Using SOAP call I am getting a URL and displaying in iframe.That URL contents one form, User need to fill all data and submit it. While I am invoking SOAP function, has given one return link also which one redirecting to my site.But problem is while returning that page is coming inside the iframe. My requirement is pretty clear that it should redirect to given path not inside iframe.
I do appreciate for advance help.
Here is the code for Iframe
<iframe style="width:955px;height:700px;margin: 0px auto;" src="<?php echo $response_data['Url']?>" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen id="js-signFrame">
</iframe>
If you have control over both the host website and the iframe content you can use easyXDM to transfer messages between the iframe and the site (of course you can use HTML5 socket but easyXDM have a great fallback mechanism which supports older browsers as well).
You can use the message logic to alter window.location of the parent window.
Here is a POC I made to show how to transfer data between different domains without getting caught by browser's same-origin-policy, you can use it as reference.
link:
https://github.com/eitankw/cross-domain
Really cannot understand why yahoo iframe works but the google one does not:
<!DOCTYPE html><html><body>
<iframe frameborder="0" src="http://www.yahoo.com"></iframe>
<iframe frameborder="0" src="http://www.google.com"></iframe>
</body></html>
any ideas?
From http://msdn.microsoft.com/en-us/library/cc288472(v=vs.85).aspx#search
Clickjacking Defense: Some hackers try to trick users into clicking buttons that appear to perform safe or harmless functions, but instead perform unrelated tasks. Clickjackers embed malicious code or "redress" the user interface by using transparent frames that overlay specific UI elements with misleading text and images. To help prevent clickjacking, Web site owners can send an HTTP response header named X-Frame-Options with HTML pages to restrict how the page may be framed.
X-Frame-Options: Deny
If the X-Frame-Options value contains the token Deny, Internet Explorer 8 prevents the page from rendering if it is contained within a frame. If the value contains the token SameOrigin, Internet Explorer will not render the page if the top level-browsing-context differs from the origin of the page containing the directive. Blocked pages are replaced with a "This content cannot be displayed in a frame" error page.
Using IE8, I get the following message in the Google iframe
This content cannot be displayed in a frame
To help protect the security of information you enter into this website, the publisher of this content does not allow it to be displayed in a frame.
Looks like Google uses some code to prevent it's content from being displayed in an iframe
EDIT:
I found a decent explanation here: http://forums.asp.net/p/1733782/4654025.aspx/1?I+am+gettignthe+following+error+in+asp+net+with+facebook+app+early+it+is+working+fine+Once+i+click+on+Open+this+content+in+a+new+window+
I have also same error.
I just included inside tag and its works for me fine.
i tested it in chrome, firefox and opera
<div style="height:820px; width:100%" >
<div style="background-color:Green; height:50px; width:100%"> </div>
<iframe id="content" style="height:820px; width:100%; overflow:auto;" src="http://www.google.com" ></iframe>
</div>
You can show google in iframe using the below link by passing igu=1
https://www.google.com/webhp?igu=1
HTML Code:
<html>
<body>
<iframe src="https://www.google.com/webhp?igu=1" height="750" width="850"></iframe>
</body>
</html>
I'm trying to insert a Mixi "like" plugin into a site. The Mixi "like" plugin is just an iframe:
<iframe src="http://plugins.mixi.jp/favorite.pl?href=http%3A%2F%2Fexample.com%2Findex.html&service_key=0123456789ABC&show_faces=false" scrolling="no" frameborder="0" allowTransparency="true" style="border:0; overflow:hidden; width:450px;height:80px;"></iframe>
The problem I have is that the ?href argument passed to the src attribute is being interpreted by IE9 Standards Mode as an actual link, so clicking on the iframe causes the browser to navigate to that page (in this example, the browser window navigates to http://example.com/index.html).
Switching IE9 to Compatibility Mode doesn't seem to have the problem, but from what I understand that's an end-user option.
Is this a common IE9 problem, where the value of an iframe's src is scraped for an href argument and used incorrectly as a link?
This is not a problem with iframes in IE9, it's a problem with Mixi's javascript. Their scripts use an older version of Prototype (1.6) in which they call an event.stop() to stop propagation. The problem is, that stop() call has problems in IE9. So clicking on the link within their iframe doesn't stop iframe from navigating to that page. This is a problem on Mixi's end, and they need to update their javascript in order to fix it.
See: disable a link in IE9 - prototype stop() not working
I am trying put place a Facebook Like-Box on a page on my site, and then style it via my own CSS (chiefly to increase the height awarded to div#stream_content. (The idea is to have the FB feed act as a news feed, but I don't want the user to have to scroll to see more the top two items or so as it does by default).
I have read and experimented with suggestions from these articles and more:
http://stackoverflow.com/questions/4064038/customizing-facebook-like-box,
http://www.daddydesign.com/wordpress/how-to-customize-your-facebook-fan-box/,
http://hitech-tips.blogspot.com/2010/05/facebook-like-button-xfbml-tutorial.html
I am going the FBML route (rather than using an iframe) as I gather is required for applying a cross-domain stylesheet. I gather also that I need this doctype declaration for my webpage:
<!doctype html lang="en" xmlns:fb="http://www.facebook.com/2008/fbml" xml:lang="en">
So then I have this in the body of the page:
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:like-box
profile_id="***my ID here***"
width="450"
height="600"
colorscheme="dark"
show_faces="false"
stream="true"
header="false"
logobar="0"
css="http://***my domain here***/css/FBstyles.css?1"
href="http://www.facebook.com/***my page name here***"
></fb:like-box>
But I still get these sorts of errors:
"(4) Unsafe JavaScript attempt to access frame with URL ...(my webpage)...from frame with URL http://www.facebook.com/plugins/likebox.php?channel=http%3A%2F%2Fstatic.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%3Fversion%3D2%23cb%3Dfd907a0e%26origin...blahblahblah. Domains, protocols and ports must match."
Where am I screwing up?
I went this route too. Although you are using FBML, the actual embedded code ends up being an iframe anyway. (you can see it in the DOM with an HTML inspector after it loads). About the only thing I was able to do was put it in a div with a colored background, since the iframe is transparent, and a border.
You are probably getting errors since the javascript on the Facebook server is trying to access the CSS on your server. I didn't think you could do this.
EDIT:
In the StackOverflow link you provided, the posted answers clearly state that using your own CSS only works with a "Fan" box, not with a "Like" box.