基础64的图像源未使用Angular JS显示

Question

我从保存在sql数据库中的字节数组中显示图像为base 64。

这是我的HTML代码

      <img id="imgavatar" data-ng-src="data:image/jpeg;base64,{{user.Avatar}}" data-err-src="~/Images/avatar.png" style="width:100px;height:100px;position:absolute" />

    <img id="imgprofile" data-ng-src="data:image/jpeg;base64,{{user.ProfileImage}}" data-err-src="~/Images/image-icon.png" style="width:200px;height:200px;position:absolute" />

图像未显示，但二进制数字附加图像源，如图所示

这是我用来将图像保存为字节数组的代码

[HttpPost]
    public ActionResult Edit(string id,string user,HttpPostedFileBase avatar, HttpPostedFileBase profile)
    {
     if (avatar != null)
            {
                p.avatar = new byte[avatar.InputStream.Length];


            }
    }

以下是获取图片的代码

Avatar = Convert.ToBase64String(profile.avatar),

图片没有显示，但字符串附加了sourcce

需要帮助我做错了什么？

Answer 1

您的数据不是Base64数据。可能是服务器端的问题。

对于客户： 尝试将此插件用于角度： https://github.com/adonespitogo/angular-base64-upload

对于服务器端 这里是将图像转换为Base64的代码：

public string ImageToBase64(Image image, 
  System.Drawing.Imaging.ImageFormat format)
{
  using (MemoryStream ms = new MemoryStream())
  {
    // Convert Image to byte[]
    image.Save(ms, format);
    byte[] imageBytes = ms.ToArray();

    // Convert byte[] to Base64 String
    string base64String = Convert.ToBase64String(imageBytes);
    return base64String;
  }
}