Question

所以，我有一个脚本用于从网络摄像头捕获视频，然后创建一个带有以下内容的gif：

var base64data;
          var img = document.createElement('img');
          var reader = new window.FileReader();
          reader.readAsDataURL(blob);
          reader.onloadend = function() {
            base64data = reader.result;
            img.src = base64data;
          }

因此，使用此脚本，我从网络摄像头获取blob对象，我将此blob编码为base64，然后将数据放入我的img.src。

之后，我需要使用jquery ajax将这些数据发送到PHP。

base64data非常大，就像2 000 000个字符一样，所以ajax请求很长（20-50秒）。

我只是发送这样的数据：

var gif = $('.generated-img').attr('src').replace('data:image/gif;base64,', '');        
    gif = gif.match(/.{1,500000}/g);
    $.ajax({
        type:"POST",
        url: "/webcam/",
        data: {image_gif:gif, crop_x:x, crop_y:y, crop_w:w, crop_h:h, gif:true},
        success: function () {
            parent.$.fancybox.close();
        }
    });

我需要将数据分成几个每个500 000个字符的块。

但它太长了..我怎么做才能优化呢？我只需要将这些数据检索到我的PHP脚本中以做一些事情......

Answer 1

我没有确切地知道为什么你需要拆分它;使用AJAX的想法 - 其中A代表异步 - 恰恰是你可以在后台做很慢的事情。

但是我不是使用正则表达式进行拆分，而是使用substr来解析它，例如类似的东西（没有经过测试，可能是偏移错误 - 例如，您可能需要+ 1或- 1此处和那里）：

 var chunkSize = 500000;
 var chunkId = 0;
 var isLastChunk = false;
 for(var i = 0; i < gif.length; i += chunkSize)
 {
    var chunk;
    if(gif.length > i + chunkSize) {
      chunk = gif.substr(0, i, chunkSize);
    } else {
      chunk = gif.substr(0, i);
      isLastChunk = true;
    }

    $.ajax({
        type:"POST",
        url: "/webcam/",
        data: {
          chunk: chunk, chunkId: chunkId, isLastChunk: isLastChunk,
          crop_x:x, crop_y:y, crop_w:w, crop_h:h, gif:true},
        success: function () {
           // Chunk handled succesfully
        }
    });
 }

在/webcam/中，您可以查看chunkId和isLastChunk。

Jquery ajax，发送非常大的数据库64，如何优化

1 个答案: