capture:Dropzone 中的“相机”不会直接在移动设备中打开相机

问题描述 投票:0回答:0

我在我的 Web 应用程序中使用 Dropzone 进行文件上传,我只需要通过相机获取图像,而不是从图库或文件管理器中获取图像。

Dropzone 文档中有一个选项可以解决问题,capture: "camera"。 但在安卓设备上,它显示了不同的视图,可以在相机、浏览器和图片库之间进行选择。

Without capture camera

With capture camera

我需要让它像带有捕获属性的 HTML 输入一样工作,它会立即打开相机进行图像采集,这样我就可以将照片放入队列中进行上传。

这是我的 Dropzone 脚本:

Dropzone.options.dropzoneFormGeneric = {
            paramName: "filesCertificazioneGenerica",
            addRemoveLinks: true,
            autoDiscover: false,
            autoProcessQueue: false,
            uploadMultiple: true,
            maxFiles: 39,
            parallelUploads: 39,
            maxFilesize: 50,
            maxThumbnailFilesize: 20,
            dictDefaultMessage:"<i><u>oppure trascinale qui</u></i>",
            dictRemoveFile: '<strong>ELIMINA</strong>',
            previewsContainer: "#dropzone-area-generic",
            clickable: "#dropzoneFormGeneric .dropzone-select",
            acceptedFiles: "image/*",
            caputure: "camera",
            init: function(){
                var submitButton = document.querySelector("#submitGeneric");
                myDropzoneGeneric = this;

                submitButton.addEventListener('click', function(e){
                    if(validateTitleGeneric()){
                        prevent_leave = true;
                        e.preventDefault();
                        e.stopPropagation();
                        myDropzoneGeneric.processQueue();
                    }
                });
                this.on("addedfile", file => {
                    document.querySelector('#submit-group-generic').style.display = "inline-block";
                    document.querySelector('#prog-group-generic').style.display = "block";
                }),
                this.on("reset", file => {
                    document.querySelector('#submit-group-generic').style.display = "none";
                    document.querySelector('#prog-group-generic').style.display = "none";
                }),
                this.on("maxfilesreached", function(file){
                    alert("ATTENZIONE: Hai raggiunto il numero massimo di file caricabili (39)!");
                });
                this.on("maxfilesexceeded", function(file){
                    var _this = this;
                    alert("ATTENZIONE: Puoi caricare massimo 39 immagini per pratica!");
                    _this.removeAllFiles();
                });
                this.on("totaluploadprogress", function (progress) {
                    var percentage = progress;
                    $('.progress .progress-bar').css("width", percentage+'%', function() {
                        return $(this).attr("aria-valuenow", percentage) + "%";
                    })
                    document.querySelector('#progress-Generic').innerText = progress+"%";
                });
                this.on("successmultiple", function (files, message) {
                    prevent_leave = false;
                    alert('Richiesta di certificazione inviata con successo!');
                    location.href = "/dashboard";
                });
                this.on("errormultiple", function (files, message) {
                    var percentage = '0';
                    $('.progress .progress-bar').css("width", percentage+'%', function() {
                        return $(this).attr("aria-valuenow", percentage) + "%";
                    })
                    var Data = (xhr.responseJSON);
                    var errors = "";
                    for (var key in Data.errors) {
                        errors = errors + Data.errors[key][0] + "\n"
                    }
                    alert(errors);
                });
            },
        };

我的代码有问题还是无法使用 Dropzone 实现此功能? 我应该换图书馆吗?

非常感谢您的帮助!

javascript mobile camera dropzone.js capture
© www.soinside.com 2019 - 2024. All rights reserved.