[英]Kendo UI upload component for angular 2 - Cannot upload
我是kendo ui,适用于angular 2和Web api(.net core)。 我无法使用Kendo Upload将文件上传到Web API。
这是我的示例代码: HTML:
<kendo-upload [saveUrl]="uploadSaveUrl"
[removeUrl]="uploadRemoveUrl"
(upload)="uploadEventHandler($event)">
</kendo-upload>
上传事件处理程序
uploadEventHandler(e: UploadEvent)
{
this.fs.uploadFile(e.files).subscribe(result => { console.log('result', result); });
}
上载服务:
uploadFile(file: any)
{
const baseUrl = this.basePath + '/api/Common/UploadFile';
return this.dah.post(baseUrl, file);
}
网络API:
[HttpPost("UploadFile")]
public string UploadFile(IList<IFormFile> files)
{
return "";
}
在这里,我无法在api中获取文件列表。 有任何有效的代码吗?
<kendo-upload #myUpload="kendoUpload" [autoUpload]="false" [saveUrl]="'/api/Attachment/PostFormData'" (upload)="uploadEventHandler($event)"> </kendo-upload>
component.ts
ploadEventHandler(e: UploadEvent) {
console.log(e.files[0].uid);
// you can send extra data here
e.data = {
attachmentType: this.typList.filter(x=>x.Uid == e.files[0].uid)[0].type
};
}
Web Api控制器
[HttpPost]
public async Task<HttpResponseMessage> PostFormData()
{
// Check if the request contains multipart/form-data.
if (!Request.Content.IsMimeMultipartContent())
{
throw new HttpResponseException(HttpStatusCode.UnsupportedMediaType);
}
string _property = System.Web.HttpContext.Current.Request.Form["attachmentType"];
string root = HttpContext.Current.Server.MapPath("~/App_Data/uploads");
var provider = new MultipartFormDataStreamProvider(root);
try
{
// Read the form data.
await Request.Content.ReadAsMultipartAsync(provider);
int i = 0;
// This illustrates how to get the file names.
foreach (MultipartFileData fileData in provider.FileData)
{
if (string.IsNullOrEmpty(fileData.Headers.ContentDisposition.FileName))
{
return Request.CreateResponse(HttpStatusCode.NotAcceptable, "This request is not properly formatted");
}
string fileName = fileData.Headers.ContentDisposition.FileName;
if (fileName.StartsWith("\"") && fileName.EndsWith("\""))
{
fileName = fileName.Trim('"');
}
if (fileName.Contains(@"/") || fileName.Contains(@"\"))
{
fileName = Path.GetFileName(fileName);
}
var ext = Path.GetExtension(fileName);
var uniqFileName = $@"{Guid.NewGuid() + "." + ext }";
File.Move(fileData.LocalFileName, Path.Combine(root, uniqFileName));
i++;
}
return Request.CreateResponse(HttpStatusCode.OK);
}
catch (System.Exception e)
{
return Request.CreateErrorResponse(HttpStatusCode.InternalServerError, e);
}
}
您没有说'this.dah'是什么,但是当使用kendo-upload'uploadFiles()'方法时,您可以通过Web-api服务中的[FromForm]属性访问文件:
[HttpPost("UploadFile")]
public string UploadFile([FromForm]ICollection<IFormFile> files)
{
return "";
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.