asp.net-mvc - ASP.NET MVC - base64String 到 html 图像

Question

我有一个 base64Strings 集合，它们需要在视图中被视为图像。

有谁知道我该怎么做？我完全被难住了。

Answer 1

ASP.NET MVC 为这些任务提供了非常好的解决方案。我们将创建一个动作，它将以 Web 浏览器知道的形式返回表示图像的流。对于包含 base64 图像的大字符串，我很抱歉，但这将确保您可以开箱即用地使用它：

static string ImageSource = "iVBORw0KGgoAAAANSUhEUgAAABgAAAASCAIAAADOjonJAAAACXBIWXMAAAsTAAALEwEAmpwYAAACcklEQVR42pVUy05UQRSs07fvvc5lGEadIQgEDD6IEDUmosQYt8pC/R39Gvf+grhzTcJ+CD7CJMDwknnc269yMfIaRKV2nfSprlOnTksgrfORAggRBEIEAsFloJTSNvgPn3/cGUtnxrKrV3SSRBBeikhE0jTVNGplbWd51b58WFucrY5WklKiI+Eg1ekjz7AAIKlDxP3DotHs7Oz3vm91lh7VJ2vZcCnSkRzfGyg+DZJKKQBaAp31nXbe68inTtHcbL9evDE3XakOxUmshOGEa5Dj90MkAWiQsI7G5S60crPSNdt7vVePx57NX69X0yzVIuFiywgISZIaALynNXCwFvvGmtx8POhubLaXno5P1EvlUhzrC50m+26KJgBrYT18ABEEbWttbpY7prl5+Ob5xNz0SLUca61Ot0hC+nJEBBqgBgkfxDr4cGxpYWSnsKvdvN3ae7tQe3K7nGmofinIE+9FIhUqwzJU0QTgHKyBC6c1B9DlJm/3dje+bKV7WUyICHnGHoGoOJ2aHHn3XhOEc7TuiIgAEvoy8+mw88I3ptgqWATx54IlFEqUUEf9qQU6L9bCs686pa2iO++bi75RD+0UJiCYC7wWjcRZEhoEnIfzsF6RJRQ1HC749Tm/UUUvpg2A/VOEjoLtrPcENAXinRgXuyJjMcnWAtduht0hFIre/SXU/XUVGB9AahBiXGI7Jde+G5oP+LUWDhMxgSz+tWsCQKkskKRmYMZ8NBzcc41bbFaQx7CeCANCzsmSfmugA0hopTE7ntw/+FmzkrEWoT8d/ucXEiVJOj4hUSTG2r31b8V2C/C4HARgQDRUv1a5OfMLsQpx+LS8fvQAAAAASUVORK5CYII=";

    public ActionResult Image()
    {
        var arr = Convert.FromBase64String(ImageSource);
        return this.File(arr, "image/png", "image.png");
    }

然后从你的角度调用它

<img src="@Url.Action("Image")"/>

PS：期待您使用家庭控制器

Answer 2

你可以做这样的事情（这是一个图像，但你可以很容易地扩展它以获得它们的列表）。

（参见base64字符串“ data:image/png;base64, ”前面的标题）

//Model
public class ImgModel
{
 public string Src { get; set; }
}

//Action
public ActionResult Index(int id = 0)
{
 var img =@"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==";
 return View(new ImgModel{Src = img});
}

//View
<div id="kk1">
 <img id="myimg1" src="@Model.Src" alt="Red dot">
</div>

我使用的示例 img 数据来自Wikipedia