Question

我为后端图片编辑过程构建了一个前端界面（不知道所有正确的术语）。

基本上：

用户应该能够通过UI上传图像文件
将其发送到服务器
以某种方式编辑图像
然后UI应显示已编辑的图像

我正在使用带有POST方法的XHR请求，如下所示，将图像文件发送到服务器。

＆＃13;

var fileSelect = document.getElementById('file-select');
var uploadButton = document.getElementById('upload-button');

uploadButton.onclick = function() {
  
  this.innerHTML = 'Uploading...';
  
  //---------------
  var files = fileSelect.files
  var formData = new FormData();
  var file = files[0]
  
  if (file.type.match('image.*')) {
      formData.append('photos[]', file, file.name);
  }
  
  var xhr = new XMLHttpRequest();
  xhr.open('POST', 'http://httpbin.org/post', true);
  xhr.onload = function() {
    if (xhr.status === 200) {
      uploadButton.innerHTML = 'Upload';
    }
    else {
      alert('An error occurred!');
    }
  };
  xhr.send(formData);
}; //end on-click 'Upload'

＆＃13;

<input type="file" id="file-select" name="photos[]"/>

<button type="submit" id="upload-button">Upload</button>

＆＃13;

我的问题是 ：一般情况下，一旦将图像文件发送到服务器，通过上面的代码，编辑后的图像何时/如何获得发回？

它是否会作为服务器响应的一部分发送回我的POST请求，因此可以在我的processRequest回调函数中访问（假设服务器配置为以这种方式处理它）？
我是否必须发送GET请求才能获取已修改的文件？

我目前无法访问服务器/后端，只知道UI应该如何工作。

编辑并发回图像文件用户上传

0 个答案: