require_once（）またはPHPスクリプトを2回実行するAJAX

Question

私は、手順に従って、セッション変数を保存するステップバイステップフォームを作っています。

私は画像をプレビューしてアップロードボタンを表示しています。これを押すと、$ _SESSION変数を変更する必要があるPHPスクリプトが呼び出され、アップロードされたファイルのパスがエコーされます。

require_once('config.php')を使わずに私のデバッガでテストすると、イメージとファイル名が表示されているのと同じように動作しますが、何らかの理由で設定ファイルを含めると、デバッガで反復するときphpスクリプトを2回実行するように見えますが、セッション変数を正しく更新しますが、ファイル名がエコーされなくなり、フロントエンドに達する前にデータが失われます。

私は、間違いがconfig.phpファイルにあるのか、AJAX呼び出しであるのか、それとも私がどこにいるのか分からないことがあります。

マークアップ（ 'step4.php'）：

<form method="post" action="step5.php"> 
    <span id="newfile"> 
     <input type="file" name="uploaded_file" id="imageupload" accept=".jpg, .jpeg, .png"> 
     <img alt="Preview Loading..." id="imagepreview"> 
    </span> 
    <!-- The submit button is elsewhere before the end of the form, it acts as a next button --> 
</form> 

javascript関数：

$(document).on('click', '#uploadbutton', function(e) { 
    e.preventDefault(); 
    //Grab upload elements and and file 
    var uploadbutton = this; 
    var uploader = document.getElementById('imageupload'); 
    var file = document.getElementById('imageupload').files[0]; 
    //Hide the upload elements 
    uploadbutton.parentNode.removeChild(uploadbutton); 
    uploader.parentNode.removeChild(uploader); 
    //Make the form and pass it to server 
    var formData = new FormData(); 
    formData.append('file', file); //$_FILES['file'] 
    $.ajax({ 
     url: 'uploadfile.php', 
     type: 'POST', 
     data: formData, 
     processData: false, 
     contentType: false 
    }) 
    .done(function(data) {//Data is the relative path to the file 
     //Hide the old content 
     document.getElementById('newfile').innerHTML = ''; 
     //Show the new image 
     var text = document.createTextNode('Uploaded File: '+data.replace('temp/', '', data)); 
     var br = document.createElement("br"); 
     var imgElement = document.createElement("IMG"); 
     imgElement.setAttribute('src', data); 
     document.getElementById('newfile').appendChild(text); 
     document.getElementById('newfile').appendChild(br); 
     document.getElementById('newfile').appendChild(imgElement); 
    }) 
    .fail(function() { 
     alert("Error uploading the file. Hit refresh and try again."); 
    }); 
}); 

'uploadfile.php'：（私のデバッガショーを二回実行されます1。.. 。）

<?php 
//require_once('config.php'); //THE PROBLEM? 

if($_FILES) { 
    //Get the uploaded file information 
    $name_of_uploaded_file = $_FILES['file']['name']; 
    //Actually upload the file to the server! 
    $upload_folder = 'temp/'; //Make a file named temp 
    $path_of_uploaded_file = $upload_folder.$name_of_uploaded_file; 
    $tmp_path = $_FILES["file"]["tmp_name"]; 

    if(is_uploaded_file($tmp_path)) { 
     copy($tmp_path,$path_of_uploaded_file); 
     $_SESSION['step4filepath'] = $path_of_uploaded_file; 
     echo $path_of_uploaded_file; 
    } 
} 

?> 

'config.phpの'：それは含まれていますとき、ネジがアップ詰め込む1

<?php 
session_start(); 

//Initialize session data 
if(empty($_SESSION)) { 
    if(!isset($_SESSION['step4filepath'])) { 
     $_SESSION['step4filepath'] = ''; 
    } 
} 

//Update session data 
if($_SERVER['REQUEST_METHOD'] === 'POST') { 

    if($_SESSION['currentPage'] == 4) { 
     //input for step 4, we just want filename if they submit the form 
     $_SESSION['step4filepath'] = $_POST['step4filepath']; 
    } 
    //Enable us to hit the back button! 
    header("Location: " . $_SERVER['REQUEST_URI']); 
} 
?> 

これは完全に失われました。

Answer 1

この件がありますか？なぜあなたの設定ファイルにその行があるのですか？

header("Location: " . $_SERVER['REQUEST_URI']); 

Answer 2

のconfig.phpは$ _POST [ 'step4filepath']と[ 'step4filepath'] $ _SESSIONの値を置き換えるのではなく、$ path_of_uploaded_fileとしてそれを残しているように見えます。

EDIT

他の箇所で述べたように、ヘッダ（）リロードを引き起こすであろう。 varが設定される前にconfig.phpが呼び出されるので、私の答えは無関係です。

Answer 3

ソリューション1

$(document).on('click', '#uploadbutton', function(e) { 

へ

$(document).off('click').on('click', '#uploadbutton', function(e) { 

ソリューション2が置換：

$(document).on("click", "#someID", function(e) { 
    $(this).attr("disabled","disabled"); 
    // Disabling the input stops the event from firing multiple times. 
    var targetObj = $(this); 
    // targetObj can be used within the $.POST function, not $(this) 
    var myVariable = "Hello world"; 
    $.post("/DoSomethingAJAXY.php", { variable1: myVariable }, 
    function(data, status){ 
    if (status == "success") { 
     // Do something 
    } 
    $(targetObj).removeAttr("disabled"); 
    // Re-enable the event input trigger 
}); 
}