Chrome quietly resubmitting form in iframe on browser back button - javascript

On a real estate website I'm working on I have a Contact Us form on the Property Details page where the user can click the Contact Us button, which will load the form in a modal dialog, an iframe loading the contact us form, fill in some details and send it off.
Once the form has been processed server side I have to emit JavaScript code from the server that calls the dialog close method and then redirects the user to a thank you page (If I did a simple redirect on the server the iframe would get the thank you page which I don't want).
The problem is in Chrome where if you hit the Browser's back button the contact form is quietly resubmitted.
Note: IE and Firefox don't have this issue at all.
I found the following links useful, but not the answer to my problem:
https://productforums.google.com/forum/#!topic/chrome/J1KMARIIHW4
https://code.google.com/p/chromium/issues/detail?id=263508 (this one seems very close to the behaviour I'm seeing - but it seems like a bug that has continually resurfaced over the last couple of years)
Chrome executing all JS again on browser back button
We've tried various techniques to circumvent the issue in Chrome like hidden fields, insured cache is turned off, destroy the iframe before redirecting to the thank you page. Nothing it keeps resubmitting the form without even asking if you want to resubmit (not that it should be resubmitting at all)

Just come across this issue, what I'm thinking of doing is including some sort of one-time token (i.e. GUID) in the form, which if we re-detect on the server we can ignore the form post. Possibly use session state on the server to keep track - much like a Rails authenticity token

Related

onbeforeunload works different on Chrome than it does on Firefox. I am looking for any potential alternatives

I am trying to add a onbeforeunload to my code so it fires a message that is sent to a server. I am encountering the following issue:
On page refresh, the message is sent to the server when using Firefox. It does not send a message to the server when I refresh the page on Google Chrome.
When clicking on links on my site to navigate to different sites, the server gets a message only when using Chrome. Firefox does not send a message when clicking on external links.
I also know that onbeforeunload is supposed to work when the window is closed, you enter a different website and navigate to that. There are some additional cases which also trigger the function. My site does not work with any of these along with the errors mentioned above.
If there a fix to this? If so, what can I do? I have looked around to fixes but I only get fixes where it prompts the user on whether they want to leave the page or not, I do not want that.
Additionally, I tried adding the function call to onclick on my external links but that is not being triggered on Firefox. I am guessing this is due to the amount of time onbeforeunload has before it is cancelled. If so, there a way around this?
Lastly, if this is not possible with onbeforeunload, what are my other options without prompting the user if they want to leave or not.
Thanks in advance!
EDIT: Here is some code that can be used:
https://jsfiddle.net/985drboy/
Make sure, that your code sending the message to the server is blocking and not async. If onbeforeunload returns before your message is sent, you get undefined behavior e.g. your message might not be sent if the page is unloads before the sending was complete. The browser continues unloading as soon as unbeforeunload returns.

Chrome extension that would update facebook group page without reloading page

I have been thinking about this but can't figure out due to lack of familarity with how actually facebook is designed to work. If you can help and point me in right direction that would be helpful.
Problem: If you are at a group page and someone post a message you have to reload the page to see the new post. Which is annoying if it turns into chatting.
Possible solutions: that i've come up with..
extension detects new notification...somehow decide if it's about the page we are at, if yes then in background load the page get the new data and add the stuff to the page already opened. (don't know if it's even possible with the extension)
2nd idea is load after detection and confirmation just reload the page and retain all text that's been written and just scroll to that post again. I inspected the post structure it all looked randomly generated string...couldn't tell if any of the class or id were reliable to identify the textbox.
3rd idea is make new page bottom up that relies on some sort of sdk and updates pages as new post come in..(least favorable to me).
4th idea is forget about retaining the text that has been typed, if all inputs are empty and there is new notification reload the page...( i really wish reloading wasn't involved.
You can use the Javascript SDK and an AJAX post. When the server responds, if nothing extraordinary happened (no access token is expired, your facebook app is allowed), then you can handle whatever you want in the callback.

How to run JavaScript and click button

I have the next task - I have a page where we have some interaction logic:
After a user clicks a button, my script redirects the user to another site where it must be populate 2 textfields then click button, after redirect to new page it must click on another button.
My project is based on ASP.NET MVC4.
My questions are:
May I do all of this?
If yes, how can I redirect to another page and run my script
P.S.: Second web site isn't my site and everything I know is id of buttons where I need to click.
Elaborating on my comment
You cannot do this in a normal browser. You could write a bookmarklet or two that would navigate and click but there is no script you can write in a web page that will do what you want for security reasons. A long time ago, it was possible in IE to load a banking site into an iFrame and script and monitor user interaction to steal credentials. This has been blocked.
If you save an HTML page with the extension HTA, it can be loaded from harddisk in windows and will have relaxed security so you could load the other site into an iFrame and script the interaction. This is likely not what you want.
The last method is to use for example CURL to get the foreign page, insert stuff and submit the form to the foreign site and return the result. This is not recommended either.
So the question to you is: Why do you need this and are there other ways to do what you want
1) location.href = "http://another.page.com"
2) impossible for security purposes

Can't prevent IE8 re-post warning with client side-code

I'm using asp.net webforms, so every server control generates post request on click. If I try to reload page with F5 or Ctrl+R after that request, browser by default shows re-post warning.
To avoid this behavior in IE 7-* I tried this solution: Unable to disable F5 key in IE8
But there is still warning in IE8 after post, whereas after get request all right.
How to deal with it?
You really shouldn't disable the F5 key or the browser back button as this is breaks the user mental model of how the browser works (and this is a bad thing).
The post warning is important because you really are POSTING the data back to the server (if this was after posting a record to a shopping cart) then you would submit the purchase again or add the previously added record to the database again.
It would be better to provide them with a clear and obvious way for them to get updates to the page when then require them.
A suggestion
If you just want to refresh the page to see the contents of an updated table or list or to get the latest status after the post then you could provide a button or link on the page that the user can click that preforms a AJAX get for the information that you requires and then just update the part of the screen that you need to redisplay.
You could also also do this with a SetTimeout so that the page / data updates in the background without the need for the user to click on a button or link.

Display popup without security warning

I use Silverlight and I'm trying to get some data to the user side. I can easily display PDF file with an <embed> tag in the browser.
However, I also have to be able to save files form the server. I tried the SaveFileDialog from Silvelright but it doesn't allow setting the file name (which is an issue).
I tried setting a hidden <iframe> source to the URL from the server but that triggers a security warning and it's not good either (there would be too many clueless users calling because it doesn't work).
I tried calling window.open to trigger a new popup set to the URL. That works OK but again there's a security warning.
Is it possible to get rid of that security message? I know it's possible in Javascript.
An exampel is on the site
http://livetecs.com
(go to the live demo, then project manager and open a report in a new window: no security warning!)
How do they achieve that behavior?
If there's any other way to get my reports saved Silverlight I'd be very interested to hear about them.
EDIT: The warning I'm talking about is the Pop-up blocked. To see this pop-up or additional options click here.. banner appearing on top of the page.
Cheers.
There is no way around the pop up blocker when you open up a window without a user action. If there was a way around that, than the pop up blockers would be useless.
Only way to avoid the security message is to have the users add your site to their safe list.
OK, after much fiddling I came accross the Silverlight built-in pop-up window that I couldn't use before.
The only limitation is that it can only be triggered by a user action (which is fine in this context() PopUpWindow at MSDN
It fits the bill perfectly and I couldn't use it before because I wanted to pre-generate the report files before opening the pop-up (and thus I wasn't in a user event context anymore).
I'm going to create a report generation page that will display a status message and then show the report (I haven't worked out yet how I'll do that though).

Categories