使用 .NET Core 上传 Summernote 图片

Summernote image upload with .NET Core

我真的很难让 SummerNote 在 .NET Core 中上传图像。问题是上传新图片时,IFormFile文件参数为null。

我使用以下方式初始化 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));
    }

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

IFormFile 类型表示 input type=file 字段的值。 IFormFile 参数根据名称绑定到字段。同一表单中可能有很多文件字段,因此类型不足以确定字段。

Sources section of the Model Binding 文档中解释了字段绑定。