在 Dropzone.js 上获取文件的 MD5

Question

我想计算每个用 Dropzone.js 上传的图像的 MD5 校验和，这样用户就可以安全地删除正确的图像（我在 php 部分计算 MD5 校验和）。

我需要用另一个库（FastMD5 或另一个库）创建 MD5 哈希，然后在单击删除按钮时将其与数据一起发送。

现在：

$Dropzone.autoDiscover = false;
    // Dropzone class:
    var myDropzone = new Dropzone("div#dropzonePreview", { 
        maxFiles:5,
        url: "up",
        acceptedFiles: ".png,.jpg,.gif,.jpeg",
        maxFilesize: 6,
        uploadMultiple: true,
        addRemoveLinks: true,

        removedfile: function(file) {
            var name = file.name;  
            var idform = document.getElementById('idform').value; //for me 
            var hash= md5(file); // not tested
            $.ajax({
                type: 'POST',
                url: 'del.php',
                data:"filename="+name+"&idform="+idform+"&hash="+hash,
                dataType: 'html'
            });
        var _ref;
        return (_ref = file.previewElement) != null ? _ref.parentNode.removeChild(file.previewElement) : void 0;        
      }

    });

问题是 md5(file) 不工作，我猜它不是数据文件，我试图寻找数据来计算哈希但一无所获。

Answer 1

我确定有更好的方法，但我已经做到了，它正在将正确的散列发送到我的删除页面 (del.php)，我刚刚意识到我会还需要哈希以避免同一文件上传 2 次..

我用过SPARK-MD5。

    Dropzone.autoDiscover = false;
        // Dropzone class:
        var myDropzone = new Dropzone("div#dropzonePreview", { 
            maxFiles:5,
            url: "upload.php",
            acceptedFiles: ".png,.jpg,.gif,.jpeg",
            maxFilesize: 6,
            uploadMultiple: true,
            addRemoveLinks: true,

        //to remove one file
            removedfile: function(file) {
                var name = file.name;  
                var idform = document.getElementById('idform').value; //for me
                // START SPARKMD5
                var blobSlice = File.prototype.slice || File.prototype.mozSlice || File.prototype.webkitSlice,
                    chunkSize = 2097152,                             // Read in chunks of 2MB
                    chunks = Math.ceil(file.size / chunkSize),
                    currentChunk = 0,
                    spark = new SparkMD5.ArrayBuffer(),
                    fileReader = new FileReader();

                fileReader.onload = function (e) {
                    console.log('read chunk nr', currentChunk + 1, 'of', chunks);
                    spark.append(e.target.result);                   // Append array buffer
                    currentChunk++;

                    if (currentChunk < chunks) {
                        loadNext();
                    } else {
                        console.log('finished loading');
                       // START DROPZONE PART
                        $.ajax({
                            type: 'POST',
                            url: 'del.php',
                            data:"filename="+name+"&idform="+idform+"&hash="+spark.end(), //spark.end is the MD5
                            dataType: 'html'
                        });
                        var _ref;
                        return (_ref = file.previewElement) != null ? _ref.parentNode.removeChild(file.previewElement) : void 0; 
                        // END DROPZONE PART
                    }
                };

                fileReader.onerror = function () {
                    console.warn('oops, something went wrong.');
                };

                function loadNext() {
                    var start = currentChunk * chunkSize,
                        end = ((start + chunkSize) >= file.size) ? file.size : start + chunkSize;

                    fileReader.readAsArrayBuffer(blobSlice.call(file, start, end));
                }

                loadNext();
                // END SPARKMD5
          }
});

我不确定 fileReader.onerror 和下一步加载的必要性。无论如何，当需要在单击 "remove" 按钮时发送散列时它可以工作，但我仍在寻找一种更好的方法来在上传之前比较 md5。

在 Dropzone.js 上获取文件的 MD5

Getting a File's MD5 on Dropzone.js

javascript

hash

dropzone.js