Redirect to another url when back button is clicked using javascript

Question

I have a payment form in which user can enter all his card details,and when he clicks,he is taken to the banks 3D secure page. But,the problem is, the user can simply click on the back button of the browser and can go back to payment page, if he initiates a "pay now" again,there is a chance of multiple transaction and duplication of ref ids.

So my question is: is there some way I can redirect the user to a custom page when he clicks on back button which says "Session expired, so transaction has been cancelled." so that we avoid duplication of ref ids?

Answer 1

Use the below jquery for redirect your own url when clicking browser back button andipedia.com

   jQuery(document).ready(function($) {

      if (window.history && window.history.pushState) {

        $(window).on('popstate', function() {
          var hashLocation = location.hash;
          var hashSplit = hashLocation.split("#!/");
          var hashName = hashSplit[1];

          if (hashName !== '') {
            var hash = window.location.hash;
            if (hash === '') {
              alert('Back button was pressed.');
                window.location='www.example.com';
                return false;
            }
          }
        });

        window.history.pushState('forward', null, './#forward');
      }

    });

Answer 2

If user clicked back button this will redirect you to your specified page (100% Working)

window.history.pushState({page: 1}, "", "");

window.onpopstate = function(event) {
    if(event){
        window.location.href = 'https://www.google.com/';
        // Code to handle back button or prevent from navigation
    }
}