Question

我的应用程序基于Ember.js (2.13)构建。我有User模型，此时我正在处理头像上传功能。当我修改模型并保存它时，Ember会在PATCH期间向我的API发出Ember请求json-api序列化程序构建漂亮的PUT对象，我喜欢它。

当我需要将图像上传到服务器时，我需要向我的API发出一些jQuery请求文件数据，我可以使用S3 ajax。服务器将调整大小并裁剪图像并将其保存在磁盘上或将其推送到User存储桶。但我不喜欢这种方式，因为这个请求将绕过Ember的序列化程序创建，而不会引用模型。所以我需要将上传的文件名设置为base64模型并保存，然后我会向服务器发出冗余请求。

我有想法在Ember.js应用中将文件转换为User字符串，并将此字符串设置为Ember.js模型并保存。在这种情况下，我会向服务器发出一个请求。这是上传文件的好方法吗？

请建议在super()应用程序中上传文件的最佳做法。

Answer 1

但我不喜欢这种方式，因为会创建此请求绕过Ember的串行器而不参考模型。

你无能为力 - 余烬数据不支持文件。在许多情况下，ED还不够好（例如 - 嵌套资源URI，部分更新）。我建议不要太烦恼 - 如果你不能使用ember数据执行某些请求，只需使用Ember.$.ajax。

所以我需要将上传的文件名设置为用户模型，然后将其保存到我之后对服务器有冗余请求。

不，你不是。只需将后端配置为返回完整的用户模型（与使用ED的其他获取/发布/更新请求一样），并将结果（如果请求成功，当然）传递给store

this.get('session').authorize('authorizer:token', (headerName, headerValue) => {
  const headers = {};
  headers[headerName] = headerValue;
  /*Instead of data object, you will create a formData*/
  const data = {
    /*Some data*/
  };
  Ember.$.ajax(
    {
      url: '/path-to-resource/id-of-resource',
      headers,
      type: "PUT",
      data
    }
  )
    .then(
      (payload) => {
        this.store.pushPayload(payload);
      },
      (response) => {
        this.set('errorMessage', stringifyError(response));
      }
    )
    .always(() => {
      this.set('isLoading', false);
    });
});

方法}}。商店将使用实际数据进行更新，无需额外请求。示例：

isa

UPD：有一个插件，pushPayload声称可以添加对文件上传的支持来嵌入数据。我自己没有尝试过，所以不能说它是否有效以及有多好。

Answer 2

你可以尝试使用流行的余烬插件。
ember-plupload和ember-uploader插件

在Ember.js中将图像上传到服务器（或S3）的正确方法是什么？

2 个答案: