Asp.Net Core WebAPI中的IFormFile总是空的 [英] IFormFile is always empty in Asp.Net Core WebAPI
本文介绍了Asp.Net Core WebAPI中的IFormFile总是空的的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
当我试图用angularjs控制器推送数据时，我遇到了一个问题。但是我做什么（IFormFile文件）总是空的。只有一些例子用剃刀的语法，但没有例子如何做到这一点与角度或jQuery。
HTML：
< form class =form-bodyenctype =multipart / form-dataname =newFileFormng-submit =vm.addFile（）>< input type =fileid =file1name =filemultiple ng-files =getTheFiles（$ files）/>< / form>
指令：
< code $（使用strict）;
$ b $ angular
.module（'app'）
.directive（'ngFiles'， ['$ parse'，function（$ parse）{
函数fn_link（scope，element，attrs）{
var onChange = $ parse（attrs.ngFiles）;
元素.on（'change'，function（event）{
onChange（scope，{$ files：event.target.files}）;
}）;
};
return {
link：fn_link
};
}]）;
}）（）;
控制器
var formdata = new FormData（）;
$ scope.getTheFiles = function（$ files）{
angular.forEach（$ files，function（key，value）{
formdata.append（key，value）;
}）;
};
vm.addFile = function（）{
var xhr = new XMLHttpRequest（）;
xhr.open（'POST'，url，true）;
xhr.setRequestHeader（Content-Type，undefined）;
xhr.send（formdata）;
}
Asp.net核心webapi：
[HttpPost]
public async Task< IActionResult> PostProductProjectFile（IFormFile文件）
{
if（！ModelState.IsValid）
{
返回BadRequest（ModelState）;
}
....
return ...;
$ b我也试着用formdata做它，因为它是在你构建时用剃刀语法发布。就像这样：
$ $ $ $ $ $ $ $ dataService.addFile（formdata，
contentDisposition：form-data; name = \ files \; filename = \C：\\\\ Users \\\\ UserName \\\\\\\\\\\\\\\\\\\\\\\\'，
contentType：multipart / form -data，
headers：{
Content-Disposition：form-data; name = \files \; filename = \C：\\Users\ \用户名\\桌面\\ snip_20160420091420.png\，
Content-Type：image / png
}，
fileName：C：用户名\用户名\\桌面\\\ snip_20160420091420.png，
名称：文件，
长度：3563
}
也可以不用formData来提供原始文件，那么什么都不会发生的
解决方案
这是如何做到这一点与angularjs：
vm.addFile = function（）{
var fileUpload = $（＃file）。get（0）;
var files = fileUpload.files;
var data = new FormData（）;
for（var i = 0; i< files.length; i ++）{
data.append（files [i] .name，files [i]）;
$ b $ http.post（/ api / Files /，data，{
headers：{'Content-Type'：undefined}，
transformRequest：angular.identity
}）。success（function（data，status，headers，config）{
}）。error（function（data，status，headers，config ）{
}）;
在web Api中：
[HttpPost]
public async Task< IActionResult> PostFile（）
{
//从angularjs读取所有文件FormData发布请求
var files = Request.Form.Files;
var strigValue = Request.Form.Keys;
.....
}
或者像这样：
[HttpPost]
public async Task< IActionResult> PostFiles（IFormCollection集合）
{
var f = collection.Files;
foreach（f中的var文件）
{
// ....
}
}
I have a problem here when I am trying to push data with angularjs controller. But what ever I do (IFormFile file) is always empty. There are only some examples with razor syntax but no examples how to do it with angular or jquery.
HTML:
<form class="form-body" enctype="multipart/form-data" name="newFileForm" ng-submit="vm.addFile()"><input type="file" id="file1" name="file" multiple ng-files="getTheFiles($files)"/></form>
Directive:
(function() {
'use strict';
angular
.module('app')
.directive('ngFiles', ['$parse', function ($parse) {
function fn_link(scope, element, attrs) {
var onChange = $parse(attrs.ngFiles);
element.on('change', function (event) {
onChange(scope, { $files: event.target.files });
});
};
return {
link: fn_link
};
}]);
})();
Controller
var formdata = new FormData();
$scope.getTheFiles = function ($files) {
angular.forEach($files, function (key, value) {
formdata.append(key, value);
});
};
vm.addFile = function () {
var xhr = new XMLHttpRequest();
xhr.open('POST', url, true);
xhr.setRequestHeader("Content-Type", "undefined");
xhr.send(formdata);
}
Asp.net core webapi:
[HttpPost]
public async Task<IActionResult> PostProductProjectFile(IFormFile file)
{
if (!ModelState.IsValid)
{
return BadRequest(ModelState);
}
....
return ...;
}
I have also tried to do it with formdata, as it is constructed when you post it with razor syntax. Something like this:
dataService.addFile(formdata, {
contentDisposition: "form-data; name=\"files\"; filename=\"C:\\Users\\UserName\\Desktop\\snip_20160420091420.png\"",
contentType: "multipart/form-data",
headers: {
"Content-Disposition": "form-data; name=\"files\"; filename=\"C:\\Users\\UserName\\Desktop\\snip_20160420091420.png\"",
'Content-Type': "image/png"
},
fileName: "C:\\Users\\UserName\\Desktop\\snip_20160420091420.png",
name: "files",
length : 3563
}
Also instead of formData to provide raw file as I wrote in comment. But still nothing happens
解决方案 This is how to do it with angularjs:
vm.addFile = function () {
var fileUpload = $("#file").get(0);
var files = fileUpload.files;
var data = new FormData();
for (var i = 0; i < files.length ; i++) {
data.append(files[i].name, files[i]);
}
$http.post("/api/Files/", data, {
headers: { 'Content-Type': undefined },
transformRequest: angular.identity
}).success(function (data, status, headers, config) {
}).error(function (data, status, headers, config) {
});
}
And in web Api:
[HttpPost]
public async Task<IActionResult> PostFile()
{
//Read all files from angularjs FormData post request
var files = Request.Form.Files;
var strigValue = Request.Form.Keys;
.....
}
Or like this:
[HttpPost]
public async Task<IActionResult> PostFiles(IFormCollection collection)
{
var f = collection.Files;
foreach (var file in f)
{
//....
}
}
这篇关于Asp.Net Core WebAPI中的IFormFile总是空的的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
