How can I disable the browser back button with JavaScript, Ruby on Rails?

Question

How to disable the browser back button while navigating in our application. I already try with the following code it prevent only go back option not hide or disable the back navigation icon.

<script type = "text/javascript" >
      history.pushState(null,null);
      window.addEventListener('popstate', function() {
          history.pushState(null,null); });
</script>

And

<script type="text/javascript">

  window.history.forward();

</script>

I want to know at least able to mask that browser back navigation icon/button (it like open new tap in browser that navigation button display as mask mode).

Answer 1

You cannot or better: you should not.

And if you can, it's an unsecure and unreliable browser.

Best practice says don't mess with the back button, the USER EXPERIENCE will suffer.

EDIT:

You can try to funnel the user by manipulating a session variable on the server-side. Keep a variable like page_number in the session, then set it to 0 on the first page.

On all subsequent pages check the page_number and force a server-side redirect if the page number is wrong.

For example, on page 4 you would do this:

if (session.page_number === 3)
{
    // ok, user comes from previous page
    session.page_number = 4;
} else {
    // server-side redirect back to proper page
    // which happens to be "session.page_number"
}

You put that code on each page (setting higher/lower page numbers) and a back-button click will cause a redirect to the same page you were before.

Obviously, this is a very bad practice. Funnels should be used only in very limited cases such as for shopping carts and credit card scenarios. A funnel causes a web page to behave more like an ATM. Air flight companies and Amazon use funnels.

You can find exact details about server-side redirects for ruby on rails on the Internet.