Question

图片

src="data:image;base64,YmxvYjpodHRwJTNBLy9sb2NhbGhvc3QlM0ExNDE0MS8wMzI1ZTA3Mi1iOTA5LTQ0YjItOTVlNS1iYzc4ZmJhZTZhMzI=" attribute value isn't displayed
with database table that has just one record with id=1

剃刀

<img id="BlobPic" src="data:image;base64,@System.Convert.ToBase64String(Model.Logoo)" style="max-width:90%;" />

行动方法

public FileContentResult getImg(int id)
        {
            BladiaInfoViewModel Bladia_Logo = rep.getByID(Convert.ToDecimal(1));
            byte[] byteArray = Bladia_Logo.Logoo;
            return new FileContentResult(Bladia_Logo.Logoo, "image/jpeg");
        }

Jquery的

  $(document).ready(function () {
        $.ajax({
            url: '@Url.Action("getImg")',
                data: { 'id': "1" },
                type: "POST",
                cache: false,
                success: function (data) {
                    //document.getElementById("BlobPic").src = "data:image/png;base64," + data.Logoo;
                    document.getElementById("Logo").setAttribute("src",'@Url.Action("getImg", "BaldiaInfo",
                    new { id = Model.Logoo})');

                },
                error: function () {
                    alert("try again");
                }
            });
            //----
        });

Answer 1

如果您要返回FileContentResult，那么看起来您真的过于复杂了。据推测，您有一个页面，其中填充该页面的模型包含此操作使用的标识符，对吧？：

public FileContentResult getImg(int id)

如果是这样，那么您不需要所有这些AJAX或Base64编码数据URI或类似的东西。您需要做的就是使用ID引用URL。像这样：

<img src="@Url.Action("getImg", "BaldiaInfo",
                new { id = Model.Logoo})" />

这将为该操作创建URL：

<img src="/BaldiaInfo/getImg/123" />

由于该操作返回了一个图像文件，因此浏览器将获得它在img src中所期望的图像文件。

相反，如果页面视图的模型不包含ID，而是包含实际图像数据，则根本不需要单独的操作来获取图像。因为你已经拥有它。在这种情况下，您可以直接在模型中使用Base64编码的URI：

<img src="data:image;base64,@System.Convert.ToBase64String(Model.Logoo)" />

没有JavaScript，没有FileContentResult的单独操作，没有。

基本上，您要么拥有一个ID，用于引用其他操作或您拥有用于构建数据URI的数据。看起来你正试图同时做两件事。

将数据库检索的字节数组转换为Razor View MVC中的图像

1 个答案: