.net-core - Summernote 使用 .NET Core 上传图片

我真的很难让 SummerNote 在 .NET 核心中上传图像。问题是上传新图像时 IFormFile 文件参数为空。

我使用以下命令初始化 Summernote -

$('#MessageBody').summernote({
    height: ($(window).height() - 300),
    callbacks: {
        onImageUpload: function(image) {
            uploadImage(image[0]);  
        }
    }
});

这是uploadImage函数 -

function uploadImage(image) {
    var data = new FormData();
    data.append("image", image);
        $.ajax({
            url: '/EmailTemplate/UploadImage',
            cache: false,
            contentType: false,
            processData: false,
            data: data,
            type: "post",
            success: function(url) {
                var image = $('<img>').attr('src', 'http://' + url);
                $('#MessageBody').summernote("insertNode", image[0]);
                
                alert(url);  
                var imgNode = document.createElement('img');  
                imgNode.src = url;  
                $('#MessageBody').summernote('insertNode', imgNode);  
            },
            error: function(data) {
                console.log(data);
            }
    });

最后,这是控制器 -

[HttpPost]
    public async Task<IActionResult> UploadImage(IFormFile file)
    {
        string message;
        var saveimg = Path.Combine(_hostingEnvironment.WebRootPath, "Images", file.FileName);
        string imgext = Path.GetExtension(file.FileName);

        if (imgext == ".jpg" || imgext == ".png")
        {
            using (var uploadimg = new FileStream(saveimg, FileMode.Create))
            {

                await file.CopyToAsync(uploadimg);
                message = "The selected file" + file.FileName + " is saved";
            }

        }
        else
        {
            message = "only JPG and PNG extensions are supported";
        }
        // return "filename : " + saveimg + " message :" + message; 
        
        return Content(Url.Content(saveimg));
    }

回答1

该参数称为file,而字段名称为image。要解决此问题,请使用相同的名称,文件或图像。

https://docs.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.http.iformfile?view=aspnetcore-6.0 类型表示 input type=file 字段的 value。 IFormFile 参数根据其名称绑定到字段。同一表单中可能有许多文件字段,因此类型不足以确定字段。

https://docs.microsoft.com/en-us/aspnet/core/mvc/models/model-binding?view=aspnetcore-6.0 文档的 https://docs.microsoft.com/en-us/aspnet/core/mvc/models/model-binding?view=aspnetcore-6.0#sources 部分解释了字段绑定。

相似文章