如何从 JS 客户端库将图像附加到新的 Trello 卡？答案

【问题标题】：How to attach image(s) to a new Trello card from the JS client library?如何从 JS 客户端库将图像附加到新的 Trello 卡？
【发布时间】：2016-06-19 21:22:32
【问题描述】：

在使用 trello_client.js 库添加新卡时，我想附加一张或更多张图片。 The documentation 只提到fileSource 是“一个文件”。

数据 URI 没有按原样工作，并且 blob 通常附加到 FormData 对象，所以我不知道如何解决这个问题，也没有找到工作示例。

甚至可以在创建卡片的同时附加多个文件，或者仅在以后通过单独的posts here附加多个文件？

【问题讨论】：

标签： javascript trello

【解决方案1】：

client.js 库不支持附加文件附件。您需要使用标准的 XHR 和 FormData 对象。

这里有一些示例代码：https://plnkr.co/edit/PjJsfMgJuJaM5A83RAiW

HTML 的相关部分：

<input type="file" id="chooser"/>
<button onclick="upload();">Upload</button>

和javascript：

// Setup
var TOKEN = "";
var KEY = "";
var CARD = "";

function upload() {
  var formData = new FormData();

  formData.append("token", TOKEN);
  formData.append("key", KEY);

  // HTML file input, chosen by user
  formData.append("file", document.getElementById('chooser').files[0]);

  var request = new XMLHttpRequest();
  request.open("POST", "https://api.trello.com/1/cards/" + CARD + "/attachments");
  request.send(formData);
}

【讨论】：

你可能是对的，我会尝试那个方向。谢谢。
@PeEll 这仅适用于一个文件。多个文件会是什么样子？有没有办法用一个 FormData 对象发送多个文件？
@tecmec 您可以访问该表单，因此如果那里有多个文件，您将不得不对每个文件进行 XHR POST。

【解决方案2】：

Trello API 需要附加 URL，或编码为 multi-part/formdata 的文件。

我整理了一系列示例，介绍了使用 Javascript 将文件附加到卡片的不同方式。你可以在这里查看：https://glitch.com/~trello-attachments-api。要查看实时运行的示例项目，请单击“Preview App”。

【讨论】：

虽然这在理论上可以回答这个问题，it would be preferable 在此处包含答案的基本部分，并提供链接以供参考。