iOS Safari bị lỗi với biểu mẫu dữ liệu bài đăng lớn gửi

Question

Tôi có phần tử Canvas HTML5. Tôi cần gửi hình ảnh canvas đến máy chủ của mình. Nó hoạt động tốt trong tất cả các trình duyệt PC mà tôi đã thử, nhưng iOS Safari bị lỗi với lỗi Out of Memory trong các tệp nhật ký. Hình ảnh canvas gần 500 KB vì nó là 950x323 PNG. Dưới đây là phiên bản đơn giản của mã gửi của tôi:

$('#imageJSON').val(JSON.stringify(myCanvas)); //I wrote other JSON stringify code. It works 
var d = myCanvas.toDataURL(); 
$('#imageData').val(d); 
$('#myForm').submit(); 

Safari bắt đầu gửi, nhưng treo vài giây vào lần gửi. Máy chủ nhận dữ liệu khác với yêu cầu, nhưng imageData chưa hoàn thành. Tôi đã thử thay đổi dạng mã hóa thành "multipart/form-data" nhưng điều đó không giúp được gì.

Answer 1

Bạn đã thử viết một bản ngã để chia nhỏ hình ảnh canvas thành các khối? Ví dụ, thay vì gọi toDataURL() trên toàn bộ canvas, bạn có thể chia nhỏ canvas thành 10-20 phần khác nhau. Lưu từng phần làm hình ảnh riêng biệt của nó. Khi bạn tải canvas, chỉ cần lắp ráp từng mảnh trên canvas. Đây là một khái niệm tương tự như các gói dữ liệu hoặc bộ đệm video.

Answer 2

Nó chỉ ra rằng có một lỗi bộ nhớ trong WebKit cho Mac. Tôi đã gửi lỗi tới webkit.org https://bugs.webkit.org/show_bug.cgi?id=84168. Tôi tìm thấy một giải pháp thay thế là gửi dữ liệu qua AJAX thay vì gửi biểu mẫu chuẩn.

$('#imageJSON').val(JSON.stringify(myCanvas)); 
var d = myCanvas.toDataURL(); 
$('#imageData').val(d); 
var data = $(form).serialize(); 
$.post(ajaxurl, data, function(r) { 
    // done. handle response. remove loading overlay. 
}); 

Làm việc tuyệt vời, nhưng đó là một nỗi đau. Tôi sử dụng javascript (mã không được hiển thị) để hướng trình duyệt đến trang thích hợp sau khi gửi biểu mẫu và nó mô phỏng một biểu mẫu gửi tiêu chuẩn, nhưng nó không phải là trơn tru cho người dùng.