使用 dropzone 实现 mediainfo.js 成功答案

【问题标题】：Implementation mediainfo.js with dropzone on success使用 dropzone 实现 mediainfo.js 成功
【发布时间】：2021-03-18 12:18:03
【问题描述】：

我想使用这个 javascript：https://github.com/buzz/mediainfo.js

我想在 Dropzone 成功事件中实现对 mediainfo.js 中函数的调用

var varFunc_Dropzone = function () {

    var dzone_upload_show_poster = function () {

        $('#dzone_poster').dropzone({

            url: "../../assets/system/sys_upload_manager.php",
            method: "POST",
            paramName: "file",
            acceptedFiles: "image/*",
            maxFiles: 1,
            maxFilesize: 1, // MB
            uploadMultiple: false,
            thumbnailWidth: null,
            thumbnailHeight: null,
            addRemoveLinks: true,
            timeout: 180000,
            dictRemoveFileConfirmation: "Sicuro?",
            dictFileTooBig: "File grande ({{filesize}}mb). Massimo consentito {{maxFilesize}}mb",
            dictInvalidFileType: "Tipo di file non valido",
            dictCancelUpload: "Cancella",
            dictRemoveFile: "Rimuovi",
            dictMaxFilesExceeded: "Sono consentiti un massimo di {{maxFiles}} file",
            dictDefaultMessage: "Trascina il file qui per effettuare Upload",

            success: function(file, done) {

// implement the trigger here for request  MediaInfo with mediainfo.js

// I try:

                    // get_file_info(MediaInfo({ format: 'text' }, {file}));
                    // var xFile = MediaInfo({ format: 'text' }, (mediainfo) => {file});
                    // var xFile = MediaInfo({ format: 'text' }, (mediainfo) => onChangeFile(file));

            }

        });

    }

    return {
        init: function() {

            dzone_upload_show_poster();
        }
    };
}();

KTUtil.ready(function() { varFunc_Dropzone.init(); });

谢谢！我希望你能帮助我！！！

【问题讨论】：

标签： javascript dropzone mediainfo

【解决方案1】：

您正在将 dropzone 文件发送到此端点： "../../assets/system/sys_upload_manager.php"

这可能不是你想要的。 mediainfo.js 在用户浏览器而不是服务器中处理文件。如果您想在服务器上处理媒体文件，您需要在接收的 PHP 脚本中进行处理。如果您打算在浏览器中处理它们，则不能使用 success 事件处理程序。来自 Dropzone.js 文档：

文件已成功上传。获取服务器响应作为第二个参数。 (Source)

为防止 Dropzone 自动上传文件，您可以将autoProcessQueue 设置为false，如this answer 所述。

然后您可以处理事件addedfile，它会为您提供File object。

有一个 simple example 如何将 mediainfo.js 与 File 对象一起使用。

免责声明：我是 mediainfo.js 的作者。

【讨论】：