Question

有人可以帮忙吗：

我们大约3年前为我们的客户建立了一个基于PHP的文件上传系统来上传pdf文件。该系统经过测试，直到最近才在几乎所有设备和浏览器上运行良好。

从今年年初开始，我们已经意识到在某些iOS设备上（并非所有设备），文件上传进度条无限期地保持在90％左右。但是文件上传得很好。该功能使用带有FormData的ajax上传（请参阅下面的代码）。很明显，成功或错误回调永远不会被执行。

系统仍能在所有其他设备/浏览器上正常运行。

经过彻底调查，我发现这个问题是由于有多个输入字段＆＃34;文件类型＆＃34; （我们需要）在表格上。如果我删除并在表单上保留一个文件上传输入字段，则一切正常。

我怀疑这是由于iOS或Safari浏览器上的一些更新。但是我应该重申，在mac上的chrome / ie仍然可以正常运行。

以下是链接：Click Post

代码

HTML：

 <input type="file" name="files[]" multiple id="file"/>

 <input type="file" name="sheets[]" multiple id="sheets"/>

  <input type="file" name="cover[]" multiple id="covers"/>

的Ajax：

   var formData = new FormData($('form')[0]);

    $.ajax({

        url: '<?php echo base_url(); ?>cart/insert/'+selected,

        type: 'POST',

        xhr: function() {

            var xhr = new window.XMLHttpRequest();

            xhr.upload.addEventListener("progress", function(evt) {

                if (evt.lengthComputable) {

                    var percentComplete = (evt.loaded / evt.total)*100;

                    progressHandlingFunction(evt);

                }

            }, false);

            return xhr;

        },

        beforeSend: function(){

            $('#file').attr('disabled', 'disabled');

            $('.image-progress').addClass('fa-spinner text-primary');

            if ( !$('.file_btn').hasClass('drop') ) {

              $('.file_btn').addClass('drop');

            }

            $('.file_btn .upload-button').addClass('hide');
            $('.file_btn .title .text').addClass('hide');
            $('.file_btn .title .file-icon .inner').addClass('hide');
            $('.file_btn .uploading').removeClass('hide');
            $('.file_btn input').addClass('hide');

            $('.uploading i.fa-cog').removeClass('hide');
            $('.uploading i.fa-check').removeClass('grow');
            $('.uploading i.fa-times').removeClass('grow');

            // Before Send - Grow background , Show Loading Icon

        },

        error: function(error){

            $('.image-error-alert').html('<div class="alert alert-warning">'+

                '<button type="button" class="close" data-dismiss="alert" aria-label="Close">'+

                '<span aria-hidden="true">&times;</span></button><ul>'+

                '<li>Something went wrong. Please close and try again.</li>'+

            '</ul></div>');

            $('#file').removeAttr('disabled');

            $('.image-progress').removeClass('fa-spinner text-primary');

            $('.image-progress').addClass('fa-warning text-danger');

            setTimeout(function(){

              $('.image-progress').removeClass('fa-warning text-danger');

            }, 1000);

            $('.file_btn').removeClass('drag-over').removeClass('drop');

            //$('.uploading').addClass('hide');
            $('.file_btn .upload-button').removeClass('hide');
            $('.file_btn .title .text').removeClass('hide');
            $('.file_btn .title .file-icon .inner').removeClass('hide');
            $('.file_btn input').removeClass('hide');

            $('.pdt-dis-progress-bar').addClass('hide');

            // Hide Loading Icon - Show Initial

        },

        success: function(html){

            $('#file').removeAttr('disabled');

            $('.image-progress').removeClass('fa-spinner text-primary');

            $('.image-progress').addClass('fa-check text-success');

            if ( html.error == 1 ) {

            setTimeout(function() {

              $('.uploading i.fa-cog').addClass('shrink');
              $('.uploading i.fa-times').addClass('grow');

            }, 500);

            setTimeout(function(){

                $('.uploading i.fa-times').removeClass('grow');
                $('.uploading i.fa-times').addClass('shrink');

              }, 1000);

            } else {

              setTimeout(function(){

                $('.uploading i.fa-cog').addClass('shrink');
                $('.uploading i.fa-cog').addClass('hide');
                $('.uploading i.fa-check').addClass('grow');

                $('.image-progress').removeClass('fa-check text-success');

              }, 500);

              $('#image-upload-display').append(html);

              setTimeout(function(){

                $('#start').addClass('shrink');

                $('.file_btn .uploading').hide();

                $('.add-file-btn').show();

                $('.order-summary').removeClass('hide');

                $('#file').val('');

                $('#add-cover-btn').removeClass('hide');

                $('#add-sheet-btn').parent().removeClass('hide');

                $('.add-file-btn').removeClass('hide');

                $('.file_btn').removeClass('drag-over').removeClass('drop');

                $('.rb-divider').removeClass('hide');

                $('.container.add-white').addClass('cart');
                $('#image-upload-display-sheet').removeClass('hide');
                $('#image-upload-display-cover').removeClass('hide');

                $('.input-title').removeClass('hide');


              }, 1000);

              setTimeout(function(){

                $('#image-upload-display').parent().addClass('grow');

                setTimeout(function(){ $('#image-upload-display').parent().addClass('rel'); }, 200);

              }, 1500);

            }

            $('.pdt-dis-progress-bar').addClass('hide');

        },

        // Form data

        data: formData,

        //Options to tell jQuery not to process data or worry about content-type.

        cache: false,

        contentType: false,

        processData: false

    });

使用Safari浏览器在某些iOS上停止使用formData文件上传

0 个答案: