Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
444 views
in Technique[技术] by (71.8m points)

javascript - Javascipt code to refresh a page with POST form on clicking back or forward buttons in the browser

I am trying to reload a page on clicking the back, forward or reload button in the browser.

Below are the use-cases:

1.User enters details in the signup form and submits -> the same page shows up with an OTP form. If this page is revisited using the back, forward, or reload button, it should be redirected to the first page with an empty signup form.

2.User submits the cart form -> moves to the checkout page and submits form -> moves to payment gateway. If the Checkout page is revisited using the back, forward, or reload button, it should be redirected to the cart page. Redirects are happening to the Cart page if I copy-paste the Checkout page to the browser, based on the type of request, GET or POST

I want this similar to Instagram signup, where the user fills the Signup form and goes to the OTP form. If the user reloads or revisits the OTP form, he is redirected to the original Signup form. Also, the tab history stack only has one page for both Signup and OTP forms

I tried using PerformanceNavigationTiming.type but it's not working. Below is the code.

var perfEntries = performance.getEntriesByType("navigation");
        if (perfEntries[0].type === "back_forward") {
            location.reload(true);
        }

I also tried PerformanceNavigation.type with no success.

Below are the list of pages I want reload for and the PerformanceNavigationTiming.type console.log(performance.getEntriesByType("navigation")[0].type) for each page on clicking back or forward buttons. All of these pages show up in the browser's tab history stack.


Cart page(/cart) --(POST request)> Order Confirmation page(/confirmcorder) --(POST request)> Payment gateway page(/payment)

back_forward <-- navigate <-- navigate

Home page(/home) --> Signup page for user details(/signup) --(POST request)> Signup page for otp(/signup)

back_forward <-- back_forward <-- navigate

Home page(/home) --> Signup page for user details(/signup) --(POST request)> Signup page for user details-with error(/signup) --(POST request with errors corrected)> Signup page for otp(/signup)

back_forward <-- back_forward <-- navigate <-- navigate

How to solve this issue?


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)
等待大神答复

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...