Dropzone.js 没有在 IOS 上上传文件

Question

我正在使用 dropzone 将文件上传到服务器。当用户将文件添加到 dropzone 时，他们可以选择更改文件的名称。例如;而不是 D6282238752Q82.png，该文件将保存为 Dog.png 。 这是我的代码：

    <script type="text/javascript">
        Dropzone.autoDiscover = false;
        
        var previewNode = document.querySelector("#template");
        previewNode.id = "";
        var previewTemplate = previewNode.parentNode.innerHTML;
        previewNode.parentNode.removeChild(previewNode);

        var myDropzone = new Dropzone('div#mydropzone', { // Make the whole body a dropzone
            url: "/Upload.aspx?no=<%= Request.QueryString["no"] %>", // Set the url
            parallelUploads: 10,
            thumbnailWidth: 150,
            thumbnailHeight: 80,
            uploadMultiple: true,
            previewTemplate: previewTemplate,
            autoProcessQueue: false,
            acceptedFiles: "image/*,application/pdf,.doc,.docx,.xls,.xlsx,.csv,.tsv,.ppt,.pptx,.pages,.odt,.rtf",
            previewsContainer: "#previews", // Define the container to display the previews
            clickable: [".fileinput-button", ".upload-drop-zone"], // Define the element that should be used as click trigger to select files.
            init: function() {
                var submitButton = document.querySelector("#submit-all")
                    myDropzone = this;
             },
               
        });

        myDropzone.on("addedfile", function (file) {
            // Hookup the start button
            var filename = file.name;
            var extension = filename.split('.').pop();
            file.previewElement.querySelector("#txtNewFileName").value = filename.substr(0, filename.lastIndexOf('.'));
            file.previewElement.querySelector("#txtFileExtension").innerHTML = filename.split('.').pop().toUpperCase();

            var submitButton = document.querySelector("#submit-all")
            submitButton.classList.remove("invisible");
            submitButton.classList.add("visible");
        });

        // Update the total progress bar
        myDropzone.on("totaluploadprogress", function (progress) {
            document.querySelector("#total-progress .progress-bar").style.width = progress + "%";
            
        });

        myDropzone.on("sending", function (file, xhr, formData) {
            // Show the total progress bar when upload starts
            document.querySelector("#total-progress").style.opacity = "1";

            var filename = file.name;
            var extension = filename.split('.').pop();
           
            var newFilename = file.previewElement.querySelector("#txtNewFileName").value + '.' + extension;
            formData.append("newFileName", newFilename);
        });
    
        myDropzone.on("processing", function () {
            myDropzone.options.autoProcessQueue = true;
        });

        // Hide the total progress bar when nothing's uploading anymore
        myDropzone.on("queuecomplete", function (sending, progress) {
            document.querySelector("#total-progress").style.opacity = "0";
        });

        myDropzone.on("success", function (progress, file) {
            var submitButton = document.querySelector("#submit-all")
            submitButton.classList.remove("visible");
            submitButton.classList.add("invisible");

            var refreshButton = document.getElementById("<%= btnRefresh.ClientID %>");
            refreshButton.click();
        });            

        myDropzone.on("removedfile", function (file) {

            //post request to remove file from server
            $.post("/Upload.aspx?no=<%= Request.QueryString["no"] %>&delete=" + file.newName);

            var refreshButton = document.getElementById("<%= btnRefresh.UserID %>");
            refreshButton.click();
        });

        myDropzone.on('dragover', function (e) {
            this.className = 'upload-drop-zone drop';
            return false;
        })
        $(document).on('click', '#submit-all', function (file) {
            myDropzone.processQueue();
        });
    </script>

它在 Chrome、Edge 和 android 上运行良好，但在 Iphone 或 Ipad 上却不行。我曾尝试在网上找到答案，但无济于事。

Answer 1

我找到了一个对我有帮助的答案，以防万一有人遇到同样的问题。 我找不到在 dropzone 中解决它的方法，所以选择了 C#。我使用了 $POST 方法来更改文件名。

$(document).on('click', '#submit-all', function (file) {
        myDropzone.processQueue();
        
        var newFilenames = [...document.querySelectorAll("#txtNewFileName")].map(sel => sel.value).join(',');

        $.post("/Upload.aspx?no=<%= Request.QueryString["no"] %>&rename=" + newFilenames);//changeFileNames);

    }); 

在 Upload.aspx.cs 我有以下代码：

if (!String.IsNullOrEmpty(Request.QueryString["rename"]))
        {
            string renameF = Request.QueryString["rename"];
            string[] renames = renameF.Split(',');

            var di = new DirectoryInfo(fileArchivePath);
            var filess = di.GetFiles().OrderByDescending(d => d.LastWriteTime).ToArray();

            int count = 0;
            foreach (string name in renames)
            {
                string inn = filess[count].FullName;
                string ext = filess[count].Extension;
                string ny = name + ext;

                string inDir = Path.Combine(fileArchivePath, inn);
                string nynavn = Path.Combine(fileArchivePath, ny);

                if (File.Exists(inDir))
                {
                    File.Copy(inDir, nynavn, true);
                    File.Delete(inDir);
                }

                count++;
            }

            return;
        }

我已经有上传文件的代码，但是额外的 Post 方法改变了现有的文件名。