Jquery 如何使用AJAX和PHP向数据库添加图像

我正在尝试向数据库中添加一个包含两列的图像，

name

和

id

。但是，当我尝试下面的代码时，只插入了

id

，而没有插入

图像

。请告诉我需要在哪里更正代码

$（函数（）{
$（'#insert'）。单击（函数（）{
var file=$（'#image'）.val（）；
$.ajax({
url:“addimg.php”，
方法：“张贴”，
async:false，
数据：{
“插入”：1，
档案：档案
},
成功：功能（数据）{
$（'#image'）.val（''）；
}
})
});
});

---

在执行我的代码之前，在mysql中将图像字段设置为blob，希望这有帮助，谢谢

HTML代码

<input type="file" name="myfile" id="image">
<input type="submit" name="insert" id="insert">

在Php中

<?php

  if (isset($_POST['insert']))
  {
    if(isset($_FILES["file"])){

    // Find location of uploaded file
    $tmpName = $_FILES["file"]["tmp_name"];

    // Read data
    $fileHandle = fopen($tmpName, "r");
    $image = fread($fileHandle, filesize($tmpName));
    fclose($fileHandle);

    // Run query
    $db = mysqli_connect("xxxx","xxx","xxx","xxx"); 
    $query = "INSERT INTO tbl_images(name) VALUES('$image')"; 
    $qry = mysqli_query($db, $query);
  }
  }
?>

替代解决方案

<?php
 $path = 'path/to/folder';
 $file_name = $_FILES['file']['name'];
 $file_tmp  = $_FILES['file']['tmp_name'];
 if (file_exists($path)) {                                             
              move_uploaded_file($file_tmp,$path.$file_name);

 } else {
    mkdir($path, 0755);                              
    move_uploaded_file($file_tmp,$path.$file_name);                                            
  }
    $path = $path.$file_name;
    $db = mysqli_connect("xxxx","xxx","xxx","xxx"); 
    $query = "INSERT INTO tbl_images(name) VALUES('$path')"; //Store image path instead
    $qry = mysqli_query($db, $query);
?>

您希望在ajax中发送多部分/表单数据。因此，您必须将数据作为FormData的对象发送。这将把给定表单的所有输入值（包括文件）（form_id是表单的id）发布到服务器。
在服务器端，您可以在$\u POST中获取发布的数据，在$\u文件中获取文件

$(function() {
  $('#insert').click(function() {
    var formdata = new FormData($('#form_id')[0]);
      $.ajax({
            url: "addimg.php",
            type: 'POST',
            dataType: 'json',
            async: false,
            cache: false,
            contentType: false,
            processData: false,
            data: formdata,
            success: function (response) {
               [ Reset your form here... ]
            }
        });
      });
});

mybe通过在ajax中键入：“post”
来更改参数
方法
？首先，在ajax请求中发送二进制数据时，需要使用FormData对象，如，并且需要将
contentType
和
processData
设置为
false
。其次，由于
image
是二进制数据，您需要将其作为BLOB存储在mySql数据库中，或者将其转换为base64并将其保存为字符串。最后，千万不要在AJAX请求中使用
async:false
，这是非常糟糕的做法。要么转换为base64，要么将文件保存到一个目录并添加到数据库的路径。您可以在网上找到许多此过程的工作示例。如果将图像作为blob存储在数据库中，可能会减慢查询执行速度，尝试将其存储在文件夹中
<?php
 $path = 'path/to/folder';
 $file_name = $_FILES['file']['name'];
 $file_tmp  = $_FILES['file']['tmp_name'];
 if (file_exists($path)) {                                             
              move_uploaded_file($file_tmp,$path.$file_name);

 } else {
    mkdir($path, 0755);                              
    move_uploaded_file($file_tmp,$path.$file_name);                                            
  }
    $path = $path.$file_name;
    $db = mysqli_connect("xxxx","xxx","xxx","xxx"); 
    $query = "INSERT INTO tbl_images(name) VALUES('$path')"; //Store image path instead
    $qry = mysqli_query($db, $query);
?>

$(function() {
  $('#insert').click(function() {
    var formdata = new FormData($('#form_id')[0]);
      $.ajax({
            url: "addimg.php",
            type: 'POST',
            dataType: 'json',
            async: false,
            cache: false,
            contentType: false,
            processData: false,
            data: formdata,
            success: function (response) {
               [ Reset your form here... ]
            }
        });
      });
});