Question

尝试通过Angular $ http上传文件。我正在设置Content-Type并使用FormData对象将其包装起来，如大多数地方所建议的那样。但是，浏览器在http请求的请求有效负载中发送[对象数据]。

服务电话：

let fd = new FormData();

            fd.append('file', file);
            return $q((resolve, reject) => {
                $http.post(url, fd, {
                    headers: {
                        'Content-Type': undefined,
                        'X-Token': undefined
                    }
                }).then(
                        success => resolve(success.data),
                        error => reject(error)
                    );
            });

关于为什么浏览器无法对此文件进行编码的想法？请注意，到目前为止，我已尝试过docx，zip，mp4文件格式。它们都会产生相同的结果。

请求有效负载：

------WebKitFormBoundaryqfOlKmKqvArA9pz6
Content-Disposition: form-data; name="file"

[object File]
------WebKitFormBoundaryqfOlKmKqvArA9pz6--

使用标记：

<input type="file" id="file-tutorial-{{$index}}-{{language.iso2}}" name="file-tutorial-{{$index}}-{{language.iso2}}"
                                     onchange="angular.element(this).scope().ctrl.addFile(this);">

Ctrl.addFile：

addFile(element) {
    service.uploadFile(element.files[0]);
    this.$scope.$digest();
}

element.files [0]或文件对象：

{lastModified:1496720186000
 lastModifiedDate:Mon Jun 05 2017 23:36:26 GMT-0400 (EDT)
 name:"Adil Sulaiman Resume.docx"
 size:25456
 type:"application/vnd.openxmlformats-
 officedocument.wordprocessingml.document"
 webkitRelativePath:""}

Answer 1

似乎缺少angular.identity，这会阻止Angular对您要发送的文件执行任何操作，例如：序列化它。请参阅解释here

您正在使用本地onchange事件，该事件超出了角度范围。有关如何访问文件对象，请查看此article。

可以找到工作演示here

尝试通过http上传文件时发送目标文件而不是文件信息

1 个答案: