首页 > 解决方案 > 使用Imagesharp调整大小后存储在SQL Server数据库中的图像未在html中显示

问题描述

我有一个 .NET Core 2.2 Web 应用程序,我将用户图像存储在 SQL Server 数据库中。当我按原样保存文件时,它会毫无问题地显示在网页中。

之后,我想在用户上传文件并安装 Imagesharp 包时调整图像大小,并使用以下代码调整图像大小。代码运行完美,但是当用户登录时,图像不显示。

我调整图像大小并将图像存储到数据库中的代码是:

图像处理方法

public Stream ResizeImage(Image<Rgba32> sourceImage, int destHeight, int destWidth)
{
    sourceImage.Mutate<Rgba32>(ctx => ctx.Resize(destWidth,destHeight));

    Stream outputStream = new MemoryStream();
    sourceImage.Save(outputStream, new JpegEncoder());

    return outputStream;
    /*return sourceImage.
            .Crop(new Rectangle(sourceX, sourceY, sourceWidth, 
sourceHeight))
            .Resize(destinationWidth, destinationHeight);*/
}

我存储图像的代码:

if (ModelState.IsValid)
{
    if (ProfileImage != null)
    {
        var stream = ProfileImage.OpenReadStream();

        Image<Rgba32> theimage = _imageProcessor.GetImageFromStream(stream);

        var outstream = _imageProcessor.ResizeImage(theimage, 100, 100);

        //Input.Image = commonData.ConvertToBytes(ProfileImage);
        Input.Image = commonData.ConvertStreamToBytes(outstream);
    }

    var user = new ApplicationUser
                   {
                        UserName = Input.Email,
                        Email = Input.Email.ToLower().Trim(),
                        FirstName = Input.FirstName,
                        LastName = Input.LastName,
                        Image = Input.Image,
                        AccountDisabled = true
                   };
}           

我试图在将其转换为 base64string 后以 html 显示图像,如下所示:

 userView.UserImageBytes = new string(Convert.ToBase64String(userView.TheUser.Image));

我的 HTML 标记来显示图像:

 <img src="data:image/jpg;base64,@Model.UserImageBytes" alt="No Image" />

上面的代码工作正常,但不显示存储的图像。

如何正确显示图像。任何帮助表示赞赏。

标签: c#sql-serverasp.net-coreimagesharp

解决方案


在这一行之后:

sourceImage.Save(outputStream, new JpegEncoder());

outputStream在最后一个写入字节之后设置了它的.Position 。例如,您可能会在图像之后将更多数据写入该流。为了让另一段代码读取图像,您需要outputStream在返回之前重新定位。例如

outputStream.Position = 0;
return outputStream;

推荐阅读