Single Page Application: Disable fast back from Browser? - html

I have single page application(Rails if it matters), where I am struggling with Browser cache. When user press back button It loads page from cache, not even HTTP 304. I have already set no-cache in response, but I belive browser has another layer of cache on top for single page application to provide fast back.
I understand there are some solutions here:-
Disable browser back button for one page application
https://softwareengineering.stackexchange.com/questions/256363/dealing-with-browser-cache-in-single-page-apps
However all of them involve, having either a popup box, or disabling back button. Both I think are terrible UX choices. Is there any other way to force browser to query server in SPA?

Related

Avoid cookies pop up window inside iframe?

I have an iframe that displays live prices of stock market. My problem is that when i load my page, this iframe shows a pop up window for cookies policy.
Is there anyway to avoid this window completely (or select "accept" in background) so that this iframe will directly show stock prices?
I found some information about sandbox option but could not go deeper with that
My website is the following and the iframe is on the down-left
https://grbusinessforum.com/
("Αποδέχομαι" is the button of "Accept cookies")
Thanks
Sandboxing the iframe can prevent all JS from running inside it, but that would probably break the page in other ways.
There's nothing you can do from outside the frame.
You'd need to change the page inside the frame instead. You could add a query string to the URL that it uses to disable the tracking cookies by default, or use postMessage to send a message into the frame that code there uses to remove the cookie prompt.
Of course, this will need the cooperation of the people who control the site you are displaying in the frame … but if they are happy for you to show their content on your page that shouldn't be too much of a problem, should it?

Chrome caching page when pressing previous button

i have a page that displays a list with vuejs, the user can do some update on this list (filters). Whenever he go to another page and then click the back button on the browser, there are still the old parameters (filters), he needs tu press refresh to get it right.
These information are sent from the PHP controller, and are corrects.
Is there a way to prevent browser caching ? i found other topics on the same problem, but no answer was really fine (mostly force page reload, which is not really fine for UX)
do you know any better solution ?
Try deleting the cookies and local storage objects, should work see here:
Clearing localStorage in javascript?

When designing website is opening new tab as bad as a popup window

My web application is mimicing the UI of my desktop application, flow is as follows
Select Task in browser window
Change any Options and then start
Show Progress in same browser window, the progress bar goess back to server every 5 seconds checking progress.
When task has completed we show report in new tab
and go back to Select task Window,
this is done by running following Javascript in progress page
window.open('/start','_self'); window.open('/reporturl','_blank');
This works fine on my PC but when trying on Safari on OSX and on Android phone and iPad one of two things happen
The progress page becomes the start page but the report page is not opened in tab
The Progress page becomes the report page
My question is does opening window in new tab with _blank have all the problems of using popup windows. If so should I modify my prcoess so that at stage 3 it just displays report page, and then add a back button or navigable footer to the report to allow user to get back to start page ?
I can think of some options you could use instead of new tab.
Modal with Ajax
-- With jQuery it is posible to open modal
dialogs they can be populated with html (or other data) fetched with ajax (async). I am a big fan of these and use them all over my projects. Users will not be annoyed with pop-up warning messages, etc. Once the content is read (or whatever) the user can simply close the dialog. (If I had to make your app I would certainly implement this).
Besides the jQuery dialogs, other modal/dialog scripts are out there. Check out Bootstrap Modal if you like it modern.
Serve report as download
-- Depending on what the user can/will do with the report, it might be interesting to write the report page in a way that it sends back a .pdf file, or another type of file, as download. Loading the URL in a new tab will now always start a download. Triggering this from JS without user interaction might be a problem though (same as with pop-up / new tab). Adding a button to trigger the download on complete will solve this.
I know the question was about the use of tabs.. But try to avoid it. Browsers handle it all in their own way. And many users get confused when suddenly stuff is opening in tabs when they did not ask for it. In case of pop-ups, it is possible for users to turn them of or convert into opening a new tab from within the browser settings. If they have been fiddling with browser defaults, you'll have troubles of keeping the 'flow' of the app the same for all users (and cross browser).

Can I clear browser cache of the page leaving page?

Can I clear browser cache of the page when I'm leaving it.
// Clear browser cache
Response.Redirect("otherpage.html");
By "clean browser cache" I didn't mean all the cache. I meant make user download the page next time he goes back to it (by pressing back button in my case).
Edit
Usually Sky Sanders suggestion works. In fact that what I tried right away, but even though it worked for simple page it failed when putting Response.Redirect after cache headers. Even though FF received headers it still provided me with a cached page when I pressed back button.
The only way you can control caching from the content end of the stick is to prevent caching in the first place.
context.Response.Cache.SetExpires(DateTime.UtcNow.AddMinutes(-1));
context.Response.Cache.SetCacheability(HttpCacheability.NoCache);
context.Response.Cache.SetNoStore();
You cannot invoke methods on the client browser.
No, you can't clear the browser cache from your web app. You could clear the cookies but that's about it.

What would cause a visitor to return to the top of the previous page, instead of to the point in the page where the link resides?

I've seen this weird behavior on several sites recently: I scroll down a page and follow a link to another page. When I click the Back button and return, I am left back at the top of the previous page, not at the link. This is very annoying if I'm clicking on links in a search results page or a list of "10 Best Foo Bars...".
See this page as an example. Strangely, the page works as expected in IE6 on WinXP, but not on FF2 on the same machine. On Mac OS X 10.4 it works in FF2, but not in FF3. I checked for any weird preference settings, but I can't find any that are different.
Any idea what is causing this?
Many sites have a text box (for searching the site, or something) that is set to automatically take focus when the page loads (using javascript or something). In many browsers, the page will jump to that text box when it gets focus.
It really is very annoying :(
Typically this behaviour is caused by the browser cache set by the site having a small or no time before expiry.
On many sites, when you hit "back" you get brought back to the link you hit, as your browser is pulling the page from your cache. If this cache has not been set, a new page request is made, and the browser treats it as fresh content.
On the page linked above, the "Expires" header seems to be set to less than a minute ahead of my local clock, which is causing my browser to get a fresh copy when I hit "back" after that expiry time.