javascript - 如何使用 angularjs 将文件详细信息发送到后端？

Question

您好，我正在使用 angularjs 开发 Web 应用程序。我正在开发文件上传模块。我有以下包含文件详细信息的数组。

//获取文件数组的代码

$scope.showPicker=function()
            {
                var client = filestack.init('AGeDIRvVZTRWgtmFbfGuZz');
                client.pick({
                }).then(function (result) {
                    arrMakes.push(result.filesUploaded);
                });
            }

在上图中，我展示了我的数组。我有三个文件。 下面是我将详细信息发送到 api 的 Angular 代码。

var files = new FormData();

angular.forEach(arrMakes, function (value, index) {
  console.log(value,index);
  files.append(index, value);
  files.append('data', angular.toJson(index).replace(/['"]+/g, ''));
});

return $http.post(this.uploadUrl, files, {
  transformRequest: angular.identity,
  headers: {
    'Content-Type': undefined,
  }
})

问题是我没有在服务器端接收文件。下行在服务器中给我 0 个文件。

System.Web.HttpFileCollection hfc = System.Web.HttpContext.Current.Request.Files;

我可以知道我向服务器发送了正确的数据吗？有人可以帮我解决这个问题吗？任何帮助将不胜感激。谢谢。

Answer 1

您没有向服务器上传任何文件，只有字符串。

您不能将对象附加到 FormData。除了Blob & File对象
看看会发生什么:

fd = new FormData
fd.append(2, {foo: 'bar'})
fd.append('data', 5)
new Response(fd).text().then(console.log)
// you get [object Object]

为什么要将“数据”中的索引字符串化？它将自动转换为字符串。您必须更换什么？

如果我在你那里，我会简单地将漏洞 arrMakes 发送到服务器并从后端的 url 下载所有文件，否则客户端必须下载然后将它们上传到服务器并浪费带宽和时间。

此外，你不需要 angulars forEach 循环，数组有内置的方法

arrMakes.forEach(function (value, index) {
  ...
})

如果你只是将 arrMarks 传递给服务器，你甚至不必使用任何循环