Question

我有一个REST api，假定在post方法中有一个多部分文件。

有没有办法在Dart / AngularDart中做这类帖子，因为到目前为止我找到的所有解决方案都无效。

我已尝试使用http://dart-gde.github.io/dart-google-oauth2-library/multipart_file/MultipartFile.html解决方案，但它无法在浏览器中运行，因为那里不支持dart.io。

我的问题是关于客户端部分直接来自浏览器。用Java编写的服务器端可以处理帖子。

Answer 1

如果您需要使用multipart进行文件上传，您只需使用FormData类发送HttpRequest对象即可。例如：

import "dart:html";

...

var fileData; //file data to be uploaded

var formData = new FormData();
formData.append("field", "value"); //normal form field
formData.appendBlob("data", fileData); //binary data

HttpRequest.request("/service-url", method: "POST", sendData: formData).then((req) {
  ...
});

此外，如果您需要允许用户从其硬盘上传文件，则必须使用带有<input type="file">标记的html表单。例如：

Html文件：

<form id="myForm" action="/service-url" method="POST" enctype="multipart/form-data">
  <input type="text" name="field"> <!-- normal field -->
  <input type="file" name="fileData"> <!-- file field -->
</form>

dart文件：

var formData = new FormData(querySelector("#myForm"));
HttpRequest.request("/service-url", method: "POST", sendData: formData).then((req) {
  ...
});

Answer 2

我知道很久以前就问过了这个问题，但是我遇到了同样的问题，我的修复方法如下（根据luizmineo的回答）：

使用formData.appendBlob("data", fileData);
不要设置明确的Content-Type标头。这将使Dart计算表格数据的boundary部分，这是至关重要的。

Answer 3

我终于找到了一种将其作为多部分形式发布的方法：

void uploadFiles() {
    var formData = new FormData(querySelector("#fileForm"));
    HttpRequest.request("/sp/file", method: "POST", sendData: formData).then((req) {
        print("OK");
    });
}

与

结合使用

<form id="fileForm" action="/sp/file" method="POST">
    <input type="file" #upload (change)="uploadFiles(upload.files)"
             (dragenter)="upload.style.setProperty('border', '3px solid green')"
             (drop)="upload.style.setProperty('border', '2px dotted gray')" class="uploadDropZone" name="toUpload"/>

如何在Dart / AngularDart中执行多部分帖子

3 个答案: