桌面圖像拖放上傳崩潰瀏覽器

我收到了通過ajaxForm上傳圖像的表單。我已經實現了一個功能，以便用戶可以從桌面上放下照片（HTML5拖放&）。如果照片是「小」，每件事情都可以正常工作 - 可以說2mb。當我嘗試上傳大於4MB的照片時出現問題。 Chrome瀏覽器崩潰。桌面圖像拖放上傳崩潰瀏覽器

給ajaxForm

$(document).ready(function() { 
    $("#uploadForm").ajaxForm({ 
     iframe: true, 
     dataType:"json", 
     beforeSubmit: function() { 
      $("#post .button.save").prop("disabled",true).val("Uploading..."); 
     }, 
     success: function (result) { 
      $("#FilePhotoString").val(""); 
      $("#post").css({ 
       "background": 'url(' + result + ') no-repeat center center', 
       "display": "block", 
       "height": $("body").height(), 
       "background-size": "cover" 
      }); 
      $("img").attr("src",result).load(function() { 
       $('input[name="ImageFilePath"]').attr('value', result); 
       $("#post .button.save.now").prop("disabled",false).val("Publish now"); 
       $("#post .button.save.later").prop("disabled",false).val("Publish later"); 
      }); 
     } 
    }); 
});

降

document.body.addEventListener('dragover',function(event) { event.preventDefault(); },false); 
document.querySelector('#content').addEventListener('drop', function(event) { 
    event.preventDefault(); 
    var reader = new FileReader(); 
     reader.onload = function(evt) { 
       $("#FilePhotoString").val(evt.target.result); 
      $("#uploadForm").submit(); 
     }; 
    reader.readAsDataURL(event.dataTransfer.files[0]); 
}, false);

結果成功返回的是上傳照片的只是路徑。任何想法我能做些什麼瀏覽器不會崩潰？

來源

2013-03-22 Luka

如何採取另一種方法，如使用FormData併發送文件而不是字符串。

var data = new FormData(document.getElementById('#uploadForm')); 
data.append('theNameYouWantToSend', event.dataTransfer.files[0]);

然後發送一個Ajax請求

$.ajax({ 
    url:'theurl', 
    type:'post', 
    data: data, 
    contentType:false, 
    processData:false, 
    ... 
});

來源

2013-03-22 19:57:50 Musa

我會嘗試這種方式。 – Luka 2013-03-23 01:12:17

我認爲它不是一個jquery/ajax /瀏覽器問題。例如，如果您使用的是Apache服務器，請檢查位於您的php.ini中的「upload_max_filesize = 2M」。

默認大小是2mb，所以它適合你很好的問題。如果您嘗試上傳超過2MB的數據，服務器會發送超時。

來源

2013-03-22 19:45:39 hyde

它不是服務器端的問題。我們獲得了10M的許可。 – Luka 2013-03-22 19:47:03

好的，問題只出現在鉻？ – hyde 2013-03-22 19:55:51

是的，只在鉻。 – Luka 2013-03-23 01:11:40

桌面圖像拖放上傳崩潰瀏覽器

回答

相關問題