我ngx-image-cropper在我的 Angular 專案中使用過在上傳之前裁剪影像。component.ts的一些相關部分是:
croppedImage: any = '';
imageCropped(event: ImageCroppedEvent) {
this.croppedImage = event.base64;
}
Base64ToFile(url: any, filename: any, mimeType: any){
return (fetch(url)
.then(function(res){return res.arrayBuffer();})
.then(function(buf){return new File([buf], filename,{type:mimeType});})
);
}
OnSubmit() {
const filedata = new FormData();
this.Base64ToFile(this.croppedImage, "myphoto.png", "image/png").then(function(outputFile){
console.log(outputFile);
filedata.append("file", outputFile, outputFile.name);//The first parameter "file" is the input parameter in API method
});
this.http.post('https://localhost:5001/api/featuredpost/postimage/' this.selectedPostId, filedata).subscribe(
response => {
console.log(response);
}
);
}
API操作:
public async Task<IActionResult> PostImage([FromForm] IFormFile file, [FromRoute] int id){
...
}
問題是,當我除錯我的 API 時,輸入file引數為 null 而cropped image有一個base64字串值。我該如何解決?我搜索了相關問題,但沒有找到任何解決我的案例的方法。
一個相關的問題
uj5u.com熱心網友回復:
this.http.post需要在.then(...)通話this.Base64ToFile(..)中
您無需等待async fetchAPI 完成之前post
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/462552.html
標籤:javascript 有角度的 打字稿 api
下一篇:串列中字典之間的匹配
