尝试将上载文件的路径插入MySQL时,会创建副本

时间:2017-03-05 18:53:52

标签: javascript php jquery html mysql

我试图将一个用户上传的图像($ picpath),一个用户输入($ uname)和一个带有可变内容的html文件($ profilepath)的路径插入到MySQL表中,如下所示:

<?php
$target_dir = 'uploads/';
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);
$uploadOk = 1;


if(isset($_POST["submit"])) {

$check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
    if($check !== false) {
        echo "File is an image - " . $check["mime"] . ".";
        $uploadOk = 1;
    } else {
        echo "File is not an image.";
        $uploadOk = 0;
    }
}

$temp = explode(".", $_FILES["fileToUpload"]["name"]);
$imageFileType = end($temp);

$random = uniqid();

$imgname = "img$random.$imageFileType";
$picpath = "uploads/$imgname";

if ($uploadOk == 0) {
echo "sorry not able to upload file";
}
else {
    if(move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], "uploads/ . $imgname)) {
        echo "the file " .$imgname. " has been uploaded!";
    }
    else {
        echo "sorry there was an error.";
    }
}


$uname = $_POST['uname'];


$filecount = count(glob("usertest/*.html"));

$filename = "user" .($filecount+1).".html";

$profilepath = "usertest/$filename";

$myfile = fopen("usertest/$filename", "w") or die("unable to create file");

$html = "<html><body><h1>this is" .$uname."'s profile</h1></body></html>";

fwrite($myfile, $html);

fclose($myfile);


$servername = "127.0.0.1";
$username = "username";
$password = "Password";
$dbname = "database";

// Create connection
$conn =  new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}



$sql = "INSERT INTO users(id, name, profilepath, picpath) VALUES (NULL, '$uname','$picpath', '$profilepath')";



if ($conn->query($sql) === TRUE) {

    echo "New record created!";
}


else {
    echo "Error.";
}




$conn->close();





?>

来自以下HTML / JS:

<!DOCTYPE html>
<html>
<head>

<script type="text/javascript" src="jquery-3.1.1.js"></script>
<script>

$('.button').click(function(){
     var unameValue = $('input:text').val();
     var actionValue = $(this).val();
     var ajaxurl = 'upload.php',
     data = {
        'uname': unameValue,

     };
     $.post(ajaxurl, data, function(response) {
         alert("success!!!!");
     });
     });
     </script>
     </head
     <body>
     <form method="POST">
     <input id="userinput" type="text" name="uname" value="peter" />


     </form>  

<form action="upload.php" method="post" enctype="multipart/form-data">
    Select image to upload:
    <input type="file" name="fileToUpload" id="fileToUpload">
    <input type="submit" class="button" value="submit" />
</form>
</body>
</body>
</html>

然而,当我运行代码时,我看到已经创建了两个html文件(只需要一个)。更重要的是,它们的名称不同(例如user1.html,user2.html)。当我检查MySQL数据库时,会出现以下内容:

ID   Name    picpath              profilepath

1    Peter   usertest/user1.html  uploads/img19ckdovj239si.
2            usertest/user2.html  uploads/img19ckdovj239si.png
3    George  usertest/user3.html  uploads/img19ckdovuv34yu.
             usertest/user4.html  uploads/img19ckdovuv34yu.png

依此类推(随机图像编号组成)。这真奇怪!我还应该补充说,有时两个图像将具有相同的uniqid()(如上所示),有时它们不会。 我尝试了我能在网上找到的所有东西,但似乎没有人遇到过这个问题! 任何帮助将不胜感激!
谢谢!


修改

这就是html的样子(它更简单,没有js!):

<!DOCTYPE html>
<html>
<body>
<form action="upload.php" method="post" enctype="multipart/form-data">
    Select image to upload:
    <input type="file" name="fileToUpload" id="fileToUpload"/>
    <input id="userinput" type="text" name="uname" value="peter" />
    <input type="submit" class="button" value="submit" />
</form>
</body>
</body>
</html>

它使用相同的PHP。

1 个答案:

答案 0 :(得分:0)

实际上并不奇怪!你发送两次数据! (使用post和ajax!)所以你的表单会发送两次。从表单标记中清除ajax函数或操作和方法,如下所示:

<!DOCTYPE html>
<html>
<head>

<script type="text/javascript" src="jquery-3.1.1.js"></script>
<script>

$('.button').click(function(){
     var unameValue = $('input:text').val();
     var actionValue = $(this).val();
     var ajaxurl = 'upload.php',
     data = {
        'uname': unameValue,

     };
     $.post(ajaxurl, data, function(response) {
         alert("success!!!!");
     });
     });
     </script>
     </head
     <body>
     <form method="POST">
     <input id="userinput" type="text" name="uname" value="peter" />


     </form>  

<form >
    Select image to upload:
    <input type="file" name="fileToUpload" id="fileToUpload">
    <input type="submit" class="button" value="submit" />
</form>
</body>
</body>
</html>