Javascript:通过ajax传递创建的图像。

时间:2018-10-11 03:19:39

标签: javascript ajax canvas

因此,我使用画布创建了图像。我想使用ajax传递图像。我知道如何使用表单来做,但是这次我不使用表单了。这是我创建图像的代码。

      var video = document.querySelector('video')
      , canvas;

      var img = document.querySelector('img') || document.createElement('img');
      var context;
      var width = video.offsetWidth
        , height = video.offsetHeight;

      canvas = canvas || document.createElement('canvas');
      canvas.width = width;
      canvas.height = height;

      context = canvas.getContext('2d');
      context.drawImage(video, 0, 0, width, height);

      img.src = canvas.toDataURL('image/png');
      document.body.appendChild(img);

“ img”变量是我创建的图像。这是我使用ajax传递图像的代码

var form = $('#fileUploadForm')[0];
      var data = new FormData(form);

      $.ajax({
          type: "POST",
          enctype: 'multipart/form-data',
          url: "/api/file/upload",
          data: data,
          processData: false, //prevent jQuery from automatically transforming the data into a query string
          contentType: false,
          cache: false,
          success: (data) => {
              $("#listFiles").text(data);
          },
          error: (e) => {
              $("#listFiles").text(e.responseText);
          }
      });

我通过创建新的FormData尝试了其他教程,但是它似乎不起作用。我也尝试为输入文件类型分配值,但是由于将来的安全性问题,它不起作用,其他人也不建议这样做。希望你能帮助我。

0 个答案:

没有答案