Dropzone.js - 如何使用普通形式&提交到mysql

时间:2014-02-07 06:05:22

标签: php mysql dropzone.js

我想使用Dropzone.js将文件存储到服务器,并将文件链接存储到MySQL数据库。但我找不到让它返回上传文件链接的方法。

我该怎么做?

以下是代码:

<section id="home">
<form action="handler.php?user_id=<?php echo $user->data()->id; ?>" class="dropzone" id="my-dropzone">
  <div class="fallback">
    <input name="file" type="file" multiple id="up" />
  </div>
</form>
</section>

<script>
Dropzone.options.myDropzone = {
    addRemoveLinks: true,
    init: function() {
        thisDropzone = this;
        $.get('handler.php?action=show', function(data) {
            $.each(data, function(key,value){
                var mockFile = { name: value.name, size: value.link};
                thisDropzone.options.thumbnail.call(thisDropzone, mockFile, "uploads/<?php echo $user->data()->id; ?>/"+value.name);
            });
        });

        thisDropzone.on('removedfile', function(file){
            $.get('handler.php?action=remove&name='+file.name+'&user_id=<?php echo $user->data()->id; ?>');
        });
    }
}
</script>

handler.php:

<?php

define('DS',DIRECTORY_SEPARATOR);
define('DES','uploads');
$action = "upload";

if (isset($_GET['action'])) {
    $action = $_GET['action'];
}

//routing for different tasks
switch($action) {
    case 'upload':
    if (!empty($_FILES)) {
        storeFile($_FILES, $_GET['user_id']);
    }
    break;

    case 'remove':
    $filename = $_GET['name'];
    removeFile($filename, $_GET['user_id']);
    break;

    case 'show':
    showFiles();
    break;
}

function storeFile($file, $user_id) {
    $tempFile = $file['file']['tmp_name'];
    //file extensions allowed
    $allowedExt = array('gif', 'jpg');
    //file size allowed in kb
    $allowedMaxSize = 10240;
    //file extension validation
    if ( count($allowedExt) >0 ) {
         $fileExt = pathinfo($file['file']['name'],PATHINFO_EXTENSION);
         if ( !in_array( $fileExt, $allowedExt ) ) {
             header("HTTP/1.0 500 Internal Server Error");
             echo 'Invalid file extension';
             exit();
         }
     }
    //file size validation
    if ( (filesize($tempFile)/1024)> $allowedMaxSize ) {
         header("HTTP/1.0 500 Internal Server Error");
         echo 'File exceeds maximum allowed size';
         exit();
    }
    //move file to server
    $targetPath = dirname( __FILE__ ) . DS . DES . DS . $user_id;
    if (!is_dir($targetPath)) {
        mkdir($targetPath);
    }
    $targetFile = $targetPath . DS . $file['file']['name'];

    if ( !move_uploaded_file($tempFile,$targetFile) ) {
         header("HTTP/1.0 500 Internal Server Error Not Found");
         echo 'Unknown server error';
         exit();
     }
}

function showFiles() {
    $result = array();
    $files  = scandir(DES);
    if ( false!==$files ) {
        foreach ( $files as $file ) {
        //ignore current and parent folder indicator
            if ( '.'!=$file && '..'!=$file) {
                $obj['name'] = $file;
                $obj['size'] = filesize(DES.DS.$file);
                $result[] = $obj;
            } 
        }
    }
    header('Content-type: text/json');
    header('Content-type: application/json');
    echo json_encode($result);
}


function removeFile($fileName, $user_id) {
    $targetPath = dirname( __FILE__ ) . DS . DES . DS . $user_id . DS;
    $targetFile = $targetPath . $fileName;
    //remove only when file exists
    if (file_exists($targetFile)) {
        unlink($targetFile);
    }
}

?>

1 个答案:

答案 0 :(得分:1)

不确定您是否已解决问题,但我使用此示例并且一切正常

Dropzonejs Example

的index.php

<html>
 <head> 
 <link href="css/dropzone.css" type="text/css" rel="stylesheet" />
 </head>
 <body>
      <form action="upload.php" class="dropzone">
      </form>

  <script src="js/dropzone.min.js"></script>
 </body>
</html>

upload.php的

<?php  
 //require 'yourconnectionfile.php';
 //I'm using mysql_ as an example, it should be PDO

$ds = DIRECTORY_SEPARATOR;
$foldername = "./uploads";

if (!empty($_FILES)) {
    $fileupload = basename( $_FILES['file']['name']);
    $fileType = $_FILES['file']['type'];
    $fileSize = $_FILES['file']['size'];

    $tempFile = $_FILES['file']['tmp_name'];
    $targetPath = dirname( __FILE__ ) . $ds. $foldername . $ds;
    $targetFile =  $targetPath. $fileupload;
    move_uploaded_file($tempFile,$targetFile);
    //Your Upload SQL goes here
  //$uploadsql = "INSERT INTO uploads (Filename, description, Type, Size)
    //              VALUES ('$fileupload', 'test uploads', '$fileType', '$fileSize')";
    //mysql_query($uploadsql);
}
?>

使用上面的示例获取css&amp; js代码和几张图片。