Calling a JS function on a nested iframe with Firefox - javascript

I've made a site which handles online credit card payments. As part of the payment process an iframe is required on my site which works with an external security service to validate credit card data. I need to pass specific information to this iframe which it will use in a form post. I do this from my site by calling a function on this iframe, as follows:
var frame = window.frames["SecureFrame"];
frame.SetInnerFormValues(...);
This works fine in my dev environment. However, my site also needs to be run as an iframe on any client sites. So in the end, the client site will have an iframe pointing to my payment interface, which has a iframe pointing to the secure service. Both of these iframes are of course using SSL.
This seems to create an issue with the multiple nested frames on the client side. (Well, Chrome works fine, but Firefox doesn't)
When an end user is on a client site, an error occurs when my JS code above is executed. Firefox throws an error saying "TypeError: frame.SetInnerFormValues is not a function". I tried executing some code in the JS console to attempt to get to this SetInnerFormValues function on the secure frame, but all I'm getting is "Error: Permission denied to access property '...'" when just trying to access anything on my own site first.
Please, Ninja's of SO, I need your help!

Since the iFrame is loaded from another website, you can't do regular javascript function calls on it. That would be cross-site scripting (XSS). You need to set up an interface on your server that responds to SSL-secured (https:) POST requests to keep your users' information safe.

Related

The page was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint

I am calling a rest API from Https deployed Application
to Http Rest API.
I have written the logic in JavaScript by using Angular Js framework.
The web service call got failed with the below message.
The page at 'https://********someurl****' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint
Requesting if any one can help me get out of this error.
Workaround:
1- Click the shield icon in the far right of the address bar.
Allow mixed content in Google Chrome
2- In the pop-up window, click "Load anyway" or "Load unsafe script".
If you want to set your Chrome browser to ALWAYS(in all webpages) allow mixed content:
1- Close Chrome. Chrome must be fully closed before the next steps.
2- Right-click the Google Chrome desktop icon (or Start Menu link). Select Properties.
3- At the end of the existing information in the Target field, add: " --allow-running-insecure-content" (There is a space before the first dash.)
4- Click OK.
5- Open Chrome and try to launch the content that was blocked earlier. It should work now.
This is just workaround and you need to solve by securing both app and rest api.
Use an https endpoint for your Rest API, otherwise you will end up with mixed content
HTTPS is important to protect both your site and your users from attack.
Mixed content degrades the security and user experience of your HTTPS site.
If you are unable to switch to https, another solution is to set up a server side end point which you access via https, which then makes the call to the http url and returns the result. In other words, making your own little HTTPS proxy to the http resource
In my case chrome was causing the issue, don't know why, other browsers work fine.
**Tip: I wasted two days trying to find out the cause, hope this will help someone.

Opening a link to an intranet site when function disabled in IE

So recently I have been tasked with making standard hyperlinks work on a website that open pages on an intranet site. This works in Chrome on the same environment but not in IE 8. This is the clients current supported browser.
The issue is that in IE the setting Websites in less privileged web content zone can navigate into this zone. is disabled by policy settings, so if you attempt to open a link from the site to an intranet site, in IE 8 you get an Access Denied error.
Now obviously given this is disabled and can't be enabled in the short term (if at all) and given that providing them a link to copy is not an agreeable solution, I have been asked to see what is possible.
One url points to the sitemap of the intranet site. I also do not have access to the intranet site code.
Things I have tried:
Using javascript opening a window - Access Denied
Using javascript to open a blank window and injecting javascript to update the window.location, this also resulted in an Accesss Denied because the new window appears to be on the original domain (rather than blank).
IIS Reverse proxy, clicking on the link appears to host the intranet site from within the current site. This worked well but two features failed to work on the intranet site due to internal redirects, so wasn't feasible.
Performing a redirect from a mapped internal link to the required intranet link at IIS and .Net Controller levels, both of these fail as redirects are disabled on the client machine.
IFrame, eurgh - Access Denied
So my question is given that the feature is disabled by IE can any one think of the way around this?
Thanks
Just in-case anyone finds this useful. I managed to resolve this using the IIS Reverse proxy. There was an issue with some internal redirects not being handled, which was under a different sub folder to the rest of the site. But the main issue I had in getting this to work was that calls to .aspx files on the external site were actually being caught by the internal site's page handler, which meant that the rewrite rules for certain calls were getting handled as pages internally and returning a 404 page.
As our internal site uses razor under MVC, the page handler isn't used, so I was luckily able to remove the page handlers within the web.config. If this wasn't the case, I would have had to reorder the handlers so that the redirect rules handled the call before the handler.

Get iframe content when showing error document?

Question first:
Is it possible to get iframe contents when it's displaying a browser error document (page not found, connection lost, certificate problem...)?
Problem explained:
I've built a simple form with an iframe inside. This iframe has a simple file upload form that works great in every test I have done. BUT the form is meant to be used inside a company's network and some users are reporting random problems when sending the iframe upload form from inside the network. I suspect that they are receaving lost connections because of internal network malfunctions and the iframe gets blank after sending (because the size is too small to display the error document and scrollbars are disabled).
As I'm not able to reproduce the errors I need to debug the process with Javascript, logging what is loaded inside the iframe after an error occurs to a user.
Actually I use jQuery to retrieve iframe's content:
$("#iframeid").contents().find("body").html();
Works great when retrieving a regular html document but not when trying to retrieve a browser error document. In this case I get the error:
Permission denied to access property "document"
Why is this happening? Because of same origin policy? Is there any way to override this?
Why is this happening? Because of same origin policy?
Yes.
Is there any way to override this?
No.
The browser does not allow you to read the contents of an internal document, like a 404 page. You will want to configure your webserver or fastcgi to return a soft 404 page which would allow you to view the contents of the iframe.

Peoplesoft screens in an iFrame

Has anyone successfully integrated Peoplesoft screens or navigation via an iFrame in a third party app like Liferay or uPortal?
We are trying to integrate Liferay Portal as a web front end and consume some of the PeopleSoft screens in an iFrame portlet. Both the Liferay Portal and Peoplsoft systems are on different top level domains. We are using Oracle Single Sign On on bot the applications. We have a couple of issues with this.
The screens display in the iFrame - however, the JavaScript on the PeopleSoft does not execute and keeps spinning. In Chrome devtools console, there is the following error:
Uncaught TypeError: Cannot read property 'getStoredData' of undefinedPT_PAGESCRIPT_win0_MIN_1.jsp
If not already signed in to the PeopleSoft system via SSO - the Login page pops out of the iFrame on IE browsers. To clarify based on comments below, the SSO happens for the first app like Liferay, however the user didnot try to go the second app PeopleSoft yet. So the SSO cookies for the second app (PeopleSoft) are not yet in the session. So when we access the page with the iFrame containing the Peoplesoft page, it pops out of the frame in IE trying to establish SSO session and cookies with PeopleSoft.
Has anyone been able to solve any of these issues?
Any insight would be much appreciated. I can provide more details if needed.
Thanks!
Edited for clarification based on comments below.
We have been able to resolve the above 2 issues.
First, we created a new instance of the portal in the same parent domain as the PeopleSoft domain and ensured both were using SSL so the protocol matched. This resolved the cross domain JS errors
Second, we changed our Oracle IdM SSO login flow to always redirect to a new PeopleSoft PIA which redirects back to Liferay's original URL. This ensures there is a valid PeopleSoft session and prevents iFrame popouts along with other integration issues. There is a lot of changes and work done by our team on this around related use cases(deep links, session timeouts) and flows. I'd be happy to post more details if anyone is proceeding down the same path.
Thanks for all the comments which helped us dig in the right direction. We also got feedback from other Liferay and PeoplesSoft customers who followed similar approaches.

Wordpress Simple facebook connect - Javascript errors

I am using Simple Facebook Connect for Worpress.
However I am getting some javascript errors.
View Image Full Size
www.connect.facebook.com/widgets/fan.php?api_key=xxxx&channel_url=http%3A%2F%2Fjquery.webspirited.com%2F%3Fxd_receiver%3D1&id=189373481094312&name=&width=285&connections=10&stream=0&logobar=1&css=
GET (same url as above) undefined (undefined) Unsafe
JavaScript attempt to access frame with URL http://jquery.webspirited.com/ from frame with URL
http://www.facebook.com/extern/login_status.php?api_key=xxxx&extern=2&channel=http%3A%2F%2Fjquery.webspirited.com%2F%3Fxd_receiver%3D1&locale=en_US.
Domains, protocols and ports must
match.
How can I fix these errors?
Short answer: You can't. This error happens in Safari and sometimes Chrome. The webkit based browsers have a somewhat tighter security model for cross domain same-origin policies. The way Facebook Connect works is that it tries one method to make things work, then if that fails, it falls back to another approach.
The fall back means that the code still works, but the error comes up because they try that method first.
This is how Facebook's code works. You can't fix it. You can't work around it. If you're going to use Facebook's code, then you learn to live with it.
last time, when i got an error like this, i forgot to set up the url in my facebook-application.
http://www.facebook.com/developers/ > Application settings > Web Site > Site URL, Site Domain
The api-key is alway linked with your url. The url of the website, where u implement the iframe must have the same URL like this.
You might like my Simple Facebook Comments For Wordpress wordpress plugin I recently released. It makes the whole process of adding facebook connect comments to your wordpress site super easy and fast.
http://www.davidswordpressplugins.com/simple-facebook-comments-for-wordpress/

Categories

Resources