HTTP iFrame blank in HTTPS page - javascript

Please help me!
I've installed SSL certificate on my server and now can't access on "mixed contents" anymore. My actual problem is an iFrame widget which is HTTP only:
<iframe src="http://www.exchangerates.org.uk/widget/ER-LRTICKER.php?w=435&s=1&mc=USD&mbg=FFFFFF&bs=no&bc=000044&f=verdana&fs=10px&fc=555555&lc=597384&lhc=FF8201&vc=FF8201&vcu=008000&vcd=FF0000&" width="435" height="30" frameborder="0" scrolling="no" marginwidth="0" marginheight="0"></iframe>
The result is that I get the content blocked (blank on page) on both Firefox and IE.
Is there any workaround? But please just don't tell me to change browser settings since my users are not going to do so.
Thanks in advance for your attention!

The easiest solution (for you) is to have the 3rd party supply a SSL/TLS URL.
If that however is not possible you are out of luck (with only frontend languages as tagged on your question).
If you are also running a backend language though you could proxy the iframe URL and provide the proxied URL in your iframe e.g. https://yourdomain.com/exchangerates which retrieves the page (including the resources used).
Another option would be to see whether the site has an API so you can download the data you need so that you can display the data on a page you control yourself.

Related

Why is YouTube making requests to ourdomain.example.com/error_204

We have a WordPress blog running under via a reverse Proxy under ourdomain.example.com/blog which embeds YouTube videos.
Now we are seeing requests in the chrome network tab to
POST https://ourdomain.example.com/error_204?a=logerror&t=jserror&type=SyntaxError&msg=Failed%20to%20execute%20%27postMessage%27%20on%20%27Window%27%3A%20Invalid%20target%20origin%20%27data%3A%27%20in%20a%20call%20to%20%27postMessage%27.&line=Not%20available&level=WARNING&client.name=1
This requests lead to problems in our main software (Magento, under '/', showing CSRF problems)
We could just block those requests in the server but we want to understand why they are made.
Did anybody see those requests before?
The YouTube player is apparently attempting to send an internal error report to Google servers, via the endpoint http://youtube.com/error_204, http://youtube-nocookie.com/error_204 or similar. For that purpose, it uses the relative URI /error_204; but for some reason, this relative URI is resolved relative to your domain name, not YouTube’s.
What you should do is ensure that the link to the YouTube video points to YouTube’s domain, not your own. I presume that this is a problem with the configuration of the reverse proxy, but I am unable to say much more without further detail.
The error is originating from YouTube trying to access something on data: which isn't https, or potentially the video is not visible when loaded.
Just search for data: in your project, I don't know what you've got that would be using it.
The error message itself is fairly unhelpful.
The reason was a wrong embed code of the YouTube video
<iframe width="600" height="560" &" frameborder="0" allowfullscreen="" allow="autoplay" data-src="https://www.youtube.com/embed/xxxxx?
There was a wrong & sign, caused by some WordPress template builder

Embedded HTTPS site in iframe

I have an issue trying to embedded https site in an iframe.
I keep seeing it as this in my Chrome.
But if I visit the site first, click on Advanced
Then, click proceed
then, I can see the site in the iFrame.
How do I force embedded HTTPS site in iframe without having to go through those steps?
Is there any workaround or is it not even possible?
You don't post the URL, but there is a reference in the error page to 192.237.179.29.
This makes me think that the actual problem here may actually be that the iFrame is referenced by IP address instead of by hostname.
It is very uncommon to have SSL certificates that correctly map to an IP address. And by uncommon I mean that I don't even know if it is possible to register a certificate for an IP address.
If you know the proper hostname of the website that you are trying to reach, try to use that. Or tell the site owner to reference that iframe by hostname instead.

Blocked script execution in because the document's frame is sandboxed - Angular application

I have strange problem - when deploying app (pure angular application with rest api) to production server and accessing its url via link from other site (ref from email for example) I have got blank page - firefox say nothing, chrome says
Blocked script execution in 'URL of website' because the document's
frame is sandboxed and the 'allow-scripts' permission is not set.
and blocks all my .js files...
what does it means? I have found on the Internet something about iframes but I have no iframes in my site...
Strangest thing in my opinion is that if I access that link directly everything works without any problem...
So how to avoid to this behaviour?
Thanks for any reply
The error message warns that an Iframe is sand-boxed without a proper privileges
Yes, you are clicking in an iFrame. This is an example of a sand-boxed iFrame.
<iframe sandbox src="http://usercontent.example.net/getusercontent.cgi?id=12193"></iframe>
If you inspect element on GMail, you will notice iFrames everywhere. The sandbox attribute is not always automatically attached, because the sandbox attribute controls what is allowed.
When a pop-up is needed, the attribute will change
<iframe sandbox="allow-same-origin allow-scripts allow-popups allow-forms" src="http://usercontent.example.net/getusercontent.cgi?id=12193"></iframe>
This is done to protect the user and the mail application from XSS
The iFrame has to allow pop-ups, new windows, or scripts. Whatever you are trying (probably just navigation), the action is being blocked by a sandbox.

Sandboxing Social Sharing JavaScript

I'd like to use social sharing widgets (e.g. Facebook Like, Twitter Tweet, etc) on my site, but I don't want to directly embed third-party script tags. I'd like my site to only run either trusted or sandboxed code.
Google Caja might work, but it requires the third-party code be written specifically to accommodate Caja.
Content Security Policy might work, but it is sparsely implemented, especially with IE (even 10) and there's no good way to detect if it's even present.
Is there a solution to this? Or do I have to choose between not having the buttons at all and running untrusted JavaScript?
Additional context: I'd like to run my entire site on HTTPS, but I also want to have sharing buttons. I don't want to potentially leak secure cookies to Facebook or Twitter.
If you don't trust third-party JavaScript (and I don't blame you, it's scary!), your best bet is to use the iframe implementations that these social networks provide. For instance, you can include a Facebook "Like" button by adding the following frame to your site:
<iframe src="//www.facebook.com/plugins/like.php?href=[PAGE_URL_GOES_HERE]&send=false&layout=button_count&width=450&show_faces=true&font&colorscheme=light&action=like&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe>
https://dev.twitter.com/docs/tweet-button#using-an-iframe has details on a similar setup for Twitter.
Encapsulating the code in an iframe gives you some measure of protection against the content of the frame, as it can't reach up into the parent to grab data or manipulate your code.
You can increase the level of protection by sandboxing the iframe via the (cleverly named) sandbox attribute. For instance:
<iframe sandbox="allow-script allow-same-origin" src="..."></iframe>
would load a page into an iframe, and allow it to run script with access to its origin (but still not the parent's origin). It would not, however, be able to navigate the top level document, load plugins, etc. Sandboxing is supported in Chrome, Safari, Firefox 18+, and IE9 (I think. Might be 10.).
I don't want to potentially leak secure cookies to Facebook or Twitter.
If you are afraid that when browser will go and fetch twitter/facebok JS it will pass on your website cookies, then it won't. But if you included some js it can access cookies by document.cookies. Moreover I don't think that rewriting is really an option, too much work, and what if it changes?
Security vs. usability was always a battle. I would recoomend not including those buttons on sites with sensitive informations on it. And just pray for nothing bad to happen :) Plus you may add adiitional protection mechanisms like requesting to reauthenticate before any change to user data or any sensitive data.

IE warning workaround? Page w/Secure and insecure items

I have a page that is viewed secured with 'https' in the URL, that also contains youtube urls to play video from youtube. Since the youtube URL contains 'http' with no 's' IE is giving an a warning dialog of "This page contains both secure and non-secure Items."
Is there a way I can workaround this in Javascript? Maybe after the page loads generate the youtube player HTML with a function? The url will still have to begin with 'http://'
EDIT: Thanks everyone for the input so far! I know this sounds impossible. I'd be happy if there was some conditional comment or something so I can tell IE to suppress this dialog box. It confuses our customer since most of the world is in IE, FF has much better behavior in that it tells you if you click the broken lock, but not an annoying popoup. This is like a new version of "your program has performed an illegal operation." (user hides from police) I am embedding youtube video onto the page where the src is from youtube. I am using their player, as it is hosted by them. No way out of this that I see.
I guess my fix is to only apply HTTPS to the very sensitive pages (password change, login) and come out of it in all others so youtube videos don't give this popup. I am in PHP and am worried the SESSION will get clobbered if I do this but I guess it is the only way around and will wait to tackle that bear monday.
One thing I've done to work around this problem is to create a page on my SSL site that proxies in the 3rd party resource. That way the client only sees SSL URLs.
For example, you flash player could point to the URL "https://YourSite.com/proxy.aspx?URL=http://www.youtube.com/video.swf". When "proxy.aspx" is called, it would make a new web request to the URL in the query string and return the data to the client.
If you do this you need to validate the proxied URL or use some kind ID so that the URL can not be changed since you are convincing the browser that this content is trusted.
I've worked around this problem on all browsers using the following:
1) Create a thumbnail image of the start of the video with the "Play image" tag on the snapshot and host the image on your own https server. Embed the thumbnail where you want the video to be.
2) When the user clicks on the image invoke a Javascript onclick handler to create a new window with the href of the http embedded youtube video.
function onImgClickHandler() {
//Link to embedded Viddler or Youtube video
var win = window.open("http://www.viddler.com/player/###/", "My Video",
'height=500,width=800,resizable=yes,scrollbars=yes');
win.focus();
}
3) The video will now appear in a popup of the main page.
I usually use videos as tutorials for my site, so having the video in a popup browser window works well because it can be viewed alongside the main content and lets the user follow along with the site. The browsers do not even give a redirect warning that you are invoking an http popup from an https site, so your users will not see any "scary" non-secure item warnings on any browsers.
Hope this helps, I have an example of the above on the landing page of my site: https://drchrono.com/
UPDATE: I made the image preview by taking a screenshot of the playing video.
According to this quite recent YouTube API blog post, embedded YouTube videos already support access via HTTPS. If this is the case, (and I haven't tested it, but equally I have no reason to not believe them), then you should just be able to stick the "s" into your embed URL and it will work just fine.
If there was a way around it would be a security flaw in IE and Microsoft would patch it, so I don't think you're going to get away with mixed content and no warning.
The only alternative is to host the FLVs yourself. There are a number of good SWF based FLV players available.
Having insecure links on a secure web page is an issue that has little workaround. One option is to exclude specific content on your page when a user connects via https. In this way a non-secure page load would display the content and a secure page load would not display the content:
<% if (!Request.IsSecureConnection){ %>
<div>You can't see this if the page is secure<div>
<%} %>
I have used this method with much success... Hope this helps.
I have had this same problem and found a solution.
It works without having to turn of SSL certification.
Step by step guide to fix Google chrome
You can view the fixed page listed below. It has links to YouTube,Flickr and many other websites. It is secure and has been for a few months now. Hope it helps you too.
The mod_rewrite module of the Apache httpd server can be used to embed YouTube videos on SSL secure pages without any errors, as detailed on Adam Mershon's blog.
It involves setting up a rewrite rule to redirect a path within the SSL domain to non-SSL YouTube:
.htaccess
RewriteEngine on
RewriteBase /
RewriteRule ^youtube/(.*)$ http://www.youtube.com/$1 [L]
So that inside your HTML you can embed YouTube link URLs appearing to be from your own domain, such as:
<embed src="https://www.yourdomain.com/youtube/v/mydjFYoD4WS&hl=en_US&fs=1&rel=0&autoplay=1&"
type="application/x-shockwave-flash"
allowscriptaccess="always"
allowfullscreen="true"
width="560"
height="340">
</embed>
Using Javascript to replace the URL does not work. IE7 intercepts the content, and thereafter, the warning.
I tried using (jQuery) $(function() { }); it sortof works. You can click yes/no to the dialog, the content will load nonetheless.
This is a severe problem in my world. It earns my work comments from users like "It's not user-friendly", "It's broken" or "It killed my kitten".
The proxy solution probably is the only pseudo-fix that's gonna roll. Just that it's clearly not a perfect solution either.
I try to navigate this a bit better by running as much of my sites on https as I can. Obviously the youtube case isn't fixed by that.
IE, what a silly hunk of FUD-pushing abominationware. I hope IE9 really is as vastly better as it seems. Just, not supporting XP means, well, it's sort of like it was never released. As the n00biest of users, will unwittingly write-protect the status quo until the XP-powered Chineese Skynet of 2247 finally feeds us the red pill...
Your problem occurs become the main page is grabbed using Https whilst one or more included files ( images, javascript, css etc ) is fetched using http. Fix the http url to be https.

Categories

Resources