Javascript（MVC）从数据库加载图像（字节数组）

这个问题的答案有很多，但没有一个对我有用

我需要在javascript中设置一个图像标记的“src”属性，该标记来自一个字节数组，我正在通过对控制器的ajax调用检索该字节数组。我必须在客户端这样做，因为我正在动态构建一些html（下面的简单示例中没有显示）

以下是视图：

<div>
<button onclick=" loadFromDb(); ">CLICK ME</button>
<img id="imgFromModel" src="data:image/png;base64,@Convert.ToBase64String(Model.Image)" alt="" />

<img id="imgFromScript" src="#" alt=""/>
</div>

function loadFromDb() {
    $.ajax({
        url: "/Home/LoadFromDatabase",
        async: true,
        type: "POST",
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function (response) {
            var base64String = btoa(response.Image);
            $("#imgFromScript").attr("src", "data:image/png;base64," +  base64String);
        }
    });
}

图像正确加载到“imgFromModel”标记中，但不会从脚本（“imgFromScript”标记）加载。有人能告诉我如何将一个字节数组从控制器方法加载（设置“src”attr）到图像标记中吗

---

提前感谢您的帮助

在玩了很多游戏、睡了一个好觉和一点运气之后，以下是解决方案

我需要向模型中添加一个string属性，将其称为“ImageByteAssString”，并在ajax响应中将src设置为该属性。这是密码

型号：

public byte[] Image { get; set; }
public string ImageBytesAsString { get; set; }

控制器：

var user = context.Users.FirstOrDefault();
user.ImageBytesAsString = Convert.ToBase64String(user.Image);

JAVASCRIPT:

    $.ajax({
    url: "/Home/LoadFromDatabase",
    async: true,
    type: "POST",
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    success: function (response) {
        $("#imgFromScript").attr("src", "data:image/png;base64," + response.ImageBytesAsString);
    }
});

视图：

---

我希望这对别人有所帮助。

我也尝试过这种方法，但在制作过程中，图像的加载速度非常慢。关于如何实施这个解决方案有什么想法吗？

<img id="imgFromScript" src="#" alt=""/>