Blueimp jQuery 文件上传与数据库集成

Question

此插件在页面加载时读取 blueimproot/server/php/files 上的图像文件。我需要从数据库中读取记录，并用我的自定义结构替换“下载”HTML 结构。我想显示目录产品，通过此插件上传/删除图像会影响哪些项目。

到目前为止我已经这样做了：

• 我更改了 blueimproot/server/php/upload.class.php 中的 public function get() { ... } 以从数据库中检索记录。该函数返回json对象。

  public function get() {
      /* default code of Blueimp
      $file_name = isset($_REQUEST['file']) ?
      basename(stripslashes($_REQUEST['file'])) : null;
      if ($file_name) {
          $info = $this->get_file_object($file_name);
      } else {
          $info = $this->get_file_objects();
      }
  
      header('Content-type: application/json');
      echo json_encode($info);
      */
  
      include_once('../../../../connection.php');
  
      $id_cat = $_REQUEST['catid'];
      $query = "SELECT id, name, price, img_path FROM products WHERE id_cat = $id_cat ORDER BY id";
      $prods = mysql_query($query);
  
      $prod_arr = array();
      while($prod = mysql_fetch_assoc($prods)) {
          $prod_arr[] = $prod;
      }
  
      header('Content-type: application/json');
      echo json_encode($info);
      }
  

• 我发现该函数是从 blueimproot/server/php 中的 index.php 调用的：

  switch ($_SERVER['REQUEST_METHOD']) {
      ...
      case 'GET':
          $upload_handler->get();
          break;
      ...
  

  }

我不知道返回的 json 对象在哪里处理以显示给 UI。已经 2 天了，仍然无法跟踪该功能流程。请帮忙。谢谢。

原始在线演示： http://blueimp.github.com/jQuery-File-Upload/

原始插件下载： https://github.com/blueimp/jQuery-File-Upload/downloads

Answer 1

我的建议是打开Network Tab in Firebug 并注意对server/php/index.php 的任何GET 请求。如果它发生在特定事件之后，那么您将更好地了解应该查看的位置。

我确实查看了源文件，发现唯一的 GET 请求位于 main.js

$('#fileupload').each(function () {
  var that = this;
  $.getJSON(this.action, function (result) {
    if (result && result.length) {
      $(that).fileupload('option', 'done')
        .call(that, null, {result: result});
        }
    });
  });
}

Answer 2

 public function get() {
    /*
    $file_name = isset($_REQUEST['file']) ?
        basename(stripslashes($_REQUEST['file'])) : null;
    if ($file_name) {
        $info = $this->get_file_object($file_name);
    } else {
        $info = $this->get_file_objects();
    }
    header('Content-type: application/json');
    echo json_encode($info);
    */
        $id_cat = $_REQUEST['catid'];
        $query = "SELECT id, name, price, img_path FROM products WHERE id_cat = $id_cat ORDER BY id";
        $prods = mysql_query($query);

        $prod_arr = array();
        while($prod = mysql_fetch_assoc($prods)) {
            //$prod_arr[] = $prod;

            $file = new stdClass();
            $file->name = "";// here image name goes i do not find image name in your select query
            $file->size = filesize($prod["img_path"]);// should be complete path
            $file->url =  $prod["img_path"];// should be relative path (http://localhost/images/234.jpg)
            $file->thumbnail_url = $prod["img_path"]; // thumbnail path
            $this->delete_type = "DELETE";
            $this->delete_url = ""; //here delete url you can delete image from database 
            array_push($prod_arr,$file);
        }
        header('Content-type: application/json');
    echo json_encode($prod_arr);
}

Answer 3

关注此 WIKI：https://github.com/blueimp/jQuery-File-Upload/wiki/Working-with-databases

我设置了要插入数据库的上传，然后我将我的 GET 函数更改如下：

            public function get() {
                $uploads = $this->query_db();
                header('Content-type: application/json');
                echo json_encode($uploads);
            }

和我的query_db函数如下：

         public function query_db() {
    $uploads_array = array();
    $select_result = $this->query("SELECT * FROM `uploads` ORDER BY `file_name`") or die(mysql_error());
    while($query_results = mysql_fetch_object($select_result))
        {   
            $file = new stdClass();
            $file->id = $query_results->id;
            $file->name = $query_results->file_name;
            $file->size = $query_results->file_size;
            $file->type = $query_results->file_type;
            $file->url = "http://files.domain.com/".$query_results->file_name;
            $file->thumbnail_url = "http://thumbnails.domain.com/".$query_results->file_name;
            $file->delete_url = "";
            $file->delete_type = "DELETE";
            array_push($uploads_array,$file);
        }
    return $uploads_array;
}