How to Prevent Form Resubmission when page is refreshed or back button is clicked

Question

On my form , i allow users to upload files to the database and i send them to another page, which is submission_successful.php, that says "Thank You for Submitting". But i noticed that when i hit the back button on the submission successful php file, it goes back to the form and the same information is there and allows another submission. What i want to do is kill the code, upon hitting back button, or clear everything that was inputted by the user. I found a couple of answers around like using cache control but, some were vague and others didn't work for me. And plus i don't want the user going back to the upload page when they're on the success page. So thats why i will create 2 buttons for "logout" or "go back to upload page" and if they hit back button, it will crash. I want to show the Confirm Form Resubmission page. In other post they are trying to actually prevent the "Confirm Form Resubmission" but i would like to have it for security. Here is my code

developerUpload.php

<?php

session_start();

if(array_key_exists("invalid", $_GET)){

    echo '<br><h3 style="color:red;">File(s) were already submitted! Please re-name file or select a different file...</h3>';
}

if(isset($_COOKIE['username'])){

    if($_SERVER['REQUEST_METHOD'] =="POST"){

        $price = addslashes(trim($_POST['price']));
        $description = addslashes(trim($_POST['description']));

        if(!empty($price) && !empty($description)){

            $userid = $_SESSION['id'];
            $username = $_SESSION['username'];
            echo '<br>'.$userid;
            $pack_id = rand();

            //Check file 1
            if($_FILES['file1']['error'] !== UPLOAD_ERR_OK){

                    $file1 = null;
            }else{

                $target1 = "devFiles/";
                $target_file1 = addslashes(trim($target1 . basename($_FILES["file1"]["name"])));
                $file1 = addslashes(trim($_FILES['file1']['tmp_name']));

            }

            //Check file 2
            if($_FILES['file2']['error'] !== UPLOAD_ERR_OK){

                    $file2 = null;
            }else{

                $target2 = "devFiles/";
                $target_file2 = addslashes(trim($target2 . basename($_FILES["file2"]["name"])));
                $file2 = addslashes(trim($_FILES['file2']['tmp_name']));

            }

            //Check file 3
            if($_FILES['file3']['error'] !== UPLOAD_ERR_OK){

                    $file3 = null;
            }else{

                $target3 = "devFiles/";
                $target_file3 = addslashes(trim($target3 . basename($_FILES["file3"]["name"])));
                $file3 = addslashes(trim($_FILES['file3']['tmp_name']));

            }

            //Check file 4
            if($_FILES['file4']['error'] !== UPLOAD_ERR_OK){

                    $file4 = null;
            }else{

                $target4 = "devFiles/";
                $target_file4 = addslashes(trim($target4 . basename($_FILES["file4"]["name"])));
                $file4 = addslashes(trim($_FILES['file4']['tmp_name']));

            }

            //Check file 5
            if($_FILES['file5']['error'] !== UPLOAD_ERR_OK){

                    $file5 = null;
            }else{

                $target5 = "devFiles/";
                $target_file5 = addslashes(trim($target5 . basename($_FILES["file5"]["name"])));
                $file5 = addslashes(trim($_FILES['file5']['tmp_name']));

            }

            //Check video
            if($_FILES['video']['error'] !== UPLOAD_ERR_OK){

                $video = null;
                $videoName = null;
            }else{

                $target = "devFiles/";
                $target_file = addslashes(trim($target . basename($_FILES["video"]["name"])));
                $video = addslashes(trim($_FILES['video']['tmp_name']));
                $videoName = addslashes(trim($_FILES['video']['name']));

            }

            if(file_exists($target_file1) 
               or file_exists($target_file2) 
               or file_exists($target_file3)
               or file_exists($target_file4) 
               or file_exists($target_file5) 
               or file_exists($target_file)){

                header("Location: developerUpload.php?invalid");
                exit;

            }

            if(move_uploaded_file($_FILES["file1"]["tmp_name"], $target_file1) 
               && move_uploaded_file($_FILES["file2"]["tmp_name"], $target_file2)
               && move_uploaded_file($_FILES["file3"]["tmp_name"], $target_file3)
               && move_uploaded_file($_FILES["file4"]["tmp_name"], $target_file4)
               && move_uploaded_file($_FILES["file5"]["tmp_name"], $target_file5)
               && move_uploaded_file($_FILES["video"]["tmp_name"], $target_file)){

                try{

                    // new php data object 
                    $handler = new PDO('mysql:host=127.0.0.1;dbname=magicsever', 'root', '');
                    //ATTR_ERRMODE set to exception
                    $handler->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

                }catch(PDOException $e){
                    die("There was an error connecting to the database");   

                }

                header("Location: submission_successful.php?");
                die();
            }



        }else{

            echo '<br><h1 style="color:red;">VALUES MISSING!</h1>';

        }
    }
}else {

    header("Location: developerLogin.php");
}



?>

submission_successful.php

<?php
session_start();

    if(array_key_exists("invalid", $_GET)){

        header("Location: developerUpload.php?invalid");

    }
    if(isset($_COOKIE['username'])){
        echo '<br><h1 style="color:red; text_align:center;">Thank You for Submitting!</h1>';

    }else{

        header("Location: developerLogin.php");
    }

?>

Your best bet would be to use AJAX. With it, you don't need php's header function. You'll just display a success or error message via dynamic div. — Rotimi, Jul 09 '17 at 00:59
Well is AJAX what you use to get the "Confirm Form Resubmission" page? — Jagr, Jul 09 '17 at 01:01
Possible duplicate of [Preventing form resubmission](https://stackoverflow.com/questions/3923904/preventing-form-resubmission) — Louys Patrice Bessette, Jul 09 '17 at 03:45
You can prevent that even without redirection. Look [here](https://stackoverflow.com/a/47247434/4632019) — Eugen Konkov, Nov 12 '17 at 11:53
Possible duplicate of [How to prevent form resubmission when page is refreshed (F5 / CTRL+R)](https://stackoverflow.com/questions/6320113/how-to-prevent-form-resubmission-when-page-is-refreshed-f5-ctrlr) — Eugen Konkov, Nov 12 '17 at 11:53

score 3 · Accepted Answer · answered Jul 12 '17 at 03:43

I was searching around for days and finally found something. IF you use a HTML command it will remove any input the user put when the user goes back. Because my problem was when the user goes back after be redirected, their information was still there but if you use

<form method="post" enctype="multipart/form-data" autocomplete="off">

it removes everything so it kinda helps. The user will still be allowed to go back but at least now they can't resubmit the data.

score 2 · Answer 2 · answered Jul 09 '17 at 00:50

2

Not sure whether you can check if a value exists twice in the database (thus preventing multiple submissions), but you could block users from submitting the form too frequently. Create a timestamp that gets saved upon first submission, and if the second resubmission's timestamp is not too far(big) from the first one, you could try sth like (you are submitting too frequently), or you could use ajax, or this https://es.m.wikipedia.org/wiki/Post/Redirect/Get

answered Jul 09 '17 at 00:50

Klajdi

337
1
10

I like where you;re getting at but the major problem is when i send them to the success page, i dont want them going back to the upload page. I will create 2 buttons thats for either log out or go to upload page. But i can't achieve that without the session so thats where i am stuck. – Jagr Jul 09 '17 at 00:54
Well, there is nothing u can do to disable going back. You could add a warn message https://stackoverflow.com/questions/12381563/how-to-stop-browser-back-button-using-javascript – Klajdi Jul 09 '17 at 00:58
But i saw a bunch of websites that when you you go back after submitting a form or application, you get "Confirm form Resubmission" – Jagr Jul 09 '17 at 01:00
https://stackoverflow.com/questions/8861181/clear-all-fields-in-a-form-upon-going-back-with-browser-back-button what u say is only for reload i guess, otherwise check my previous reply where u can add a message when user clicks back button. – Klajdi Jul 09 '17 at 01:01
Well your answer helped me think of something to help answer the question :D. Thanks A lot – Jagr Jul 12 '17 at 03:44

score 0 · Answer 3 · answered Jul 09 '17 at 01:01

0

Use a session variable like this

$_SESSION["post_id"] = "";
if($_POST) {
    if($_POST["post_id"] != $_SESSION["post_id"]) {
        $_SESSION["post_id"] = $_POST["post_id"];
        // do database submission here
    }
}

This sets a session variable and if they resubmit the form it won't post the data twice.

answered Jul 09 '17 at 01:01

Kaboom

674
6
27

where did you get the "$_POST['post_id']" from? – Jagr Jul 09 '17 at 01:07
Make a hidden field named `post_id` And generate a random number in it or a 10-20 character string that changes every time you refresh the form. This is the check you determine if it's been submitted with. I didn't include in answer because I'm not sure of form structure and such – Kaboom Jul 09 '17 at 01:10
Will this be at the beginning of my code or after they submit? – Jagr Jul 09 '17 at 01:17
The session is at beginning of the code, the other part is where they are posting data and the HTML field goes where your form is – Kaboom Jul 09 '17 at 02:18
I did that but not working, Can you just update it in my code so i can see what you're talking about? Most appreciated – Jagr Jul 09 '17 at 05:52
you there? I am trying it but not getting where D: – Jagr Jul 10 '17 at 17:51

score 0 · Answer 4 · answered Apr 05 '23 at 09:27

If anyone still needs this, the following answer worked for me: I would also like to point out that you can use a javascript approach, window.history.replaceState to prevent a resubmit on refresh and back button.

<script>
    if ( window.history.replaceState ) {
        window.history.replaceState( null, null, window.location.href );
    }
</script>

original answer here

How to Prevent Form Resubmission when page is refreshed or back button is clicked

4 Answers4