override browser back button [duplicate]

Question

I am working on a project in which i need to handle browser back button and on it's click I want to redirect to home page.

I have gone through many post, there are a lot of ways to implement it.

I am wondering, what is the best way to implement it.

If anyone knows similar post, please post the url.

Thanks for help

I have used the following codes:

function HandleBackFunctionality()
{
    alert('ckikc')
    if(window.event)
    {
        if(window.event.clientX < 40 && window.event.clientY < 0)
        {
            alert("Browser back button is clicked...");
        }
        else
        {
            alert("Browser refresh button is clicked...");
        }
    }
    else
    {
        alert('clicked')
        if(event.currentTarget.performance.navigation.type == 1)
        {
            alert("Browser refresh button is clicked...");
        }
        if(event.currentTarget.performance.navigation.type == 2)
        {
            alert("Browser back button is clicked...");
        }
    }
}
window.onbeforeunload = HandleBackFunctionality;
$(document).unload(HandleBackFunctionality);

well its not working for me :(

well @kapa said it is a duplicate question, I have mentioned that have googled a lot for this and have seen a lot of solutions for this problem.

my question is not the way to solve it, but the best solution out of available one

Answer 1

You can't just override a browser's button's behavior.

Imagine the security problems it would cause if anyone could just "Fake" browser navigation like that. Making users think they navigated to a different site is chapter 1 in phishing for dummies...

However, @Alek linked to a similar question, in the comments on your question, which has a decent alternative (Which is, imo, the best way to achieve the desired result).