我的目标是发送包含图像和附加信息(例如高度
和宽度
)的文件格式。我不知道如何向文件表单对象添加一些自定义 Prop 。
$("#saveImg").on('click', function () {
var formData = new FormData(),
allFiles = [];
$('input[name=fileUpload]').each(function (index) {
if (inputFileValidation(this)) {
(function (files) {
if (files.length != 0) { allFiles.push(files[0]); }
})(this.files)
}
});
for (var i = 0; i != allFiles.length; i++) {
var img = new Image()
img.src = window.URL.createObjectURL(allFiles[i]);
$(img).on('load', function () {
formData.append("files_h", img.naturalHeight);
formData.append("files_w", img.naturalWidth);
formData.append("files", allFiles[i]);
window.URL.revokeObjectURL(allFiles[i]);
});
}
$.ajax({
url: '@Url.Action("Upload", "Image")',
data: formData,
processData: false,
contentType: false,
type: "POST",
success: function () {}
errors: function () {}
});
});
[HttpPost]
public async Task<IActionResult> Upload (IList<IFormFile> files)
{
//do something ;
}
我也尝试过:
[HttpPost]
public async Task<IActionResult> Upload (IList<IFormFile> files, IList<IFormFile> files_h, IList<IFormFile> files_w)
{
//do something ;
}
也许您有另一个想法如何发送带有附加数据的图像?我尝试将文件形式和附加信息转换为 JSON,但没有成功。
编辑 谢谢大家的建议,它们对我来说非常重要,因为我将来一定会使用它们。
但是,在这个项目中,我已经放弃使用文件阅读器
,因为它的异步性
并且享受着promise
的乐趣。目标很简单,少用 javascript
,多用 c#
很抱歉在标题javascript
和jquery
中误导了您 - 并且我标记了与c#
相关的答案。我这样做是因为这个答案与我的下一个任务相关,因为 CoreCompat.System.Drawing
库无疑对于将来编辑照片仍然有用。
谢谢!!
最佳答案
如果您想在 ASP.NET Core 中上传图片时获取 Width
和 Height
属性。我建议您安装这个软件包:CoreCompat.System.Drawing
<小时/>Install-Package CoreCompat.System.Drawing -Version 1.0.0-beta006
在服务器中,将文件保存到特定路径后。您可以使用 System.Drawing.Image
类来获取 Width
和 Height
属性:
using (var image = System.Drawing.Image.FromFile(filePath))
{
int width = image.Width;
int height = image.Height;
}
在发送到服务器之前,您不必向客户端模型添加 files_h
和 files_w
属性。
然后,通过这种方式,我将你的 js 代码编辑为:
$("#saveImg").on('click', function () {
var formData = new FormData();
for (var input of Array.from($('input[name=fileUpload]')))
{
if (inputFileValidation(input) && input.files.length) {
formData.append('files', input.files[0]);
}
}
$.ajax({
url: '@Url.Action("Upload", "Image")',
data: formData,
processData: false,
contentType: false,
type: "POST",
success: function () {}
errors: function () {}
});
});
关于javascript - 如何将自定义属性添加到文件表单 javascript/jquery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53420580/