将图像从输入类型文件上传到服务器

Question

我很难将文件上传到 MySQL，这里出了什么问题？弄了3个小时都想不通，不过应该比较简单...

HTML:

 <form>
 <input class="form-control" type="file" accept="image/jpg" id="pic_in_in" required>
 <button class="btn" onclick="create_band()">Upload</button>
 </form>

JS:

function create_band() {
console.log("ADDED");

    let obj = {
        image : $('input[type=file]').val()

    };

    $.ajax({
        type: "POST",
        url: "db/addBand.php",
        data: obj,
        success: function (res) {
            loadBandsData();
            $('#pic_in_in').val("");

        }
    });
 }

PHP:

<?php

$image = $_FILES["image"]["tmp_name"];


    $dbc = mysqli_connect('localhost', 'root', '', 'va_final_project');
    $query = "INSERT INTO va_band_name (band_img) VALUES '$image'
                
    $data = mysqli_query($dbc, $query);
   mysqli_close($dbc);
?>

Answer 1

您是否尝试过将 enctype 属性添加到您的表单中？

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

这是来自 w3schools.com 的代码，祝你好运，希望对你有所帮助

Answer 2

要通过 ajax 上传文件，请使用 FormData，并将图像数据存储到数据库 table（比如在 LONGBLOB 字段中），您可以使用 fread 和 send_long_data完成这项工作。

请在下面找到代码（包括一个让您查看上传照片的代码）：

HTML

<script
  src="https://code.jquery.com/jquery-3.6.0.js"
  integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="
  crossorigin="anonymous"></script>

<form>
 <input class="form-control" type="file" accept="image/jpg" id="pic_in_in" required>
 <button class="btn" onclick="create_band()">Upload</button>
</form>

<script>

function create_band() {
//console.log("ADDED");

  var file_data = $('#pic_in_in').prop('files')[0];   
    var form_data = new FormData();                  
    form_data.append('file', file_data);
   
    $.ajax({
        async:false,
        url: 'addBand.php', // <-- point to server-side PHP script 
        dataType: 'text',  // <-- what to expect back from the PHP script, if anything
        contentType: false,
        processData: false,
        data: form_data,                         
        type: 'post',
        success: function(php_script_response){
            alert(php_script_response); // <-- display response from the PHP script, if any
        }
     });

}
 </script>

PHP (addBand.php)

<?php

ini_set('display_errors', 1); ini_set('display_startup_errors', 1); error_reporting(E_ALL);

$servername = "localhost";
$username = "xxxxxxx";
$password = "xxxxxxx";
$dbname = "xxxxxxx";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);

if($_SERVER['REQUEST_METHOD'] == 'POST')
{
    $tmpName = $_FILES['file']['tmp_name'];

  // Read the file 
  $fp      = fopen($tmpName, 'r');
  $image = fread($fp, filesize($tmpName));
  fclose($fp);

    $sql = "INSERT INTO va_band_name (band_img) VALUES (?)";

   $statement = $conn->prepare($sql);
   $null = NULL; 

   $statement->bind_param('b', $null);
   $statement->send_long_data(0, $image); 
   $statement->execute();
   
 $check = mysqli_stmt_affected_rows($statement);

 if($check == 1){
   $res = 'Image was uploaded';
 }else{
   $res = 'Something went wrong!';
 }
echo $res; 
}
?>

PHP（查看上传的照片）：

Uploaded photos (if any):
<br>

<?php

$servername = "localhost";
$username = "xxxxxxx";
$password = "xxxxxxx";
$dbname = "xxxxxxx";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);

$sql = "SELECT * FROM va_band_name";
$statement = $conn->prepare($sql);
$statement->execute();
$result = $statement->get_result();

foreach($result as $row){

echo '<img src="data:image/jpg;base64,'.base64_encode($row['band_img']).'" width="200" height=auto/>';
echo "<hr>";
}

?>

将图像从输入类型文件上传到服务器

Upload an image from input type file to a server

php