Question

您好我正在开发带有firebase的离子应用程序。我正在尝试通过调整大小来上传多个文件。

当我调用resize方法时输入图像不同但是一旦我完成上传，它最终会上传重复的图像（数组的最后一个图像）。

每次调整大小时我console.log编辑了dataURL，发现DataURL总是一样的。

以下代码是上传多个文件。

    multipleUpload: function(key, folder, files, targetWidth) {
    var q = $q.defer();
    var ct = Date.now();
    var urls = [];

    var recursive = function (n, args) {
      var arg = args[n];
      ImageService.resize(arg.file, targetWidth)
      .then(function(file) {
        upload(ct + '' + n + key, folder + '/' + key, file, CONFIG.MESSAGE.FILE_UPLOAD + (n + 1) + '번 파일')
        .then(function(url) {
          urls.push(url);
          if (++n < args.length) {
            recursive(n, args);
          } else {
            q.resolve(urls);
          }
        }), function(error) {
          q.reject(error);
        };
      })
    }
    recursive(0, files);

    return q.promise;
  },

以下代码是调整大小的方法

  resize: function(file, targetWidth) {
    var q = $q.defer();
    // Resizing Image
    var img = new Image();
    img.setAttribute('crossOrigin', 'anonymous');
    img.onload = function(){
      var canvas = document.createElement("canvas"),
      ctx = canvas.getContext("2d");
      canvas.width = targetWidth;
      canvas.height = canvas.width * (img.height / img.width);
      ctx.drawImage(this, 0, 0, canvas.width, canvas.height);
      // Data URL to BLOB
      var dataURL = canvas.toDataURL();
      console.log(dataURL); // Returns same dataURL all the time.
      dataURLtoBlob(dataURL, Date.now())
      .then(function(blob) {
        q.resolve(blob);
      });
    };
    img.src = file;
    return q.promise;
  },

Answer 1

首先，我发现有一点奇怪，它在ios上工作正常，但是安卓。

我开始挖掘插件选项并禁用allow-edit然后它运行正常。我相信这是插件的一个问题。

canvas.toDataURL（）返回相同的dataURL

1 个答案: