在 html 前端顯示 C# asp 字符串 iframe - 字符串格式“data:image/bmp;base64,” + base64 編碼

Question

我有一個 html 和 asp C# 后端應用程序，我想在其中顯示格式為“data:image/bmp;base64”的字符串，“+ base64 編碼字符串在 iframe 中。
服務器代碼正在生成字符串：

using (MemoryStream stream = new MemoryStream())
{
   bitmap.Save(stream, ImageFormat.Bmp);
   stream.Position = 0;
   content = Convert.ToBase64String(stream.ToArray()); // base64EncodedString
}

前端 iframe 應該在按下按鈕時顯示它：

<form method="POST" runat="server">
   <asp:Button runat="server" id="button1" class="btn" Text="Next"/>
   <iframe id="iframe" runat="server" class="iframe"></iframe>
</form>
<script>
   window.onload = function () {
     document.getElementById("<%=iframe.ClientID %>").src="data:image/bmp;base64,"+"<%=content %>";
   }
</script>

例如，內容字段已正確填充和共享（如可以在警報中顯示）； “data:image/bmp;base64,Qk1aAAAAAAAAAEEIAAAAoAAAABgAAAAYAAAABAAQAAAAAAAAAAADEDgAAxA4AAAMAAADAAAAAAAA/wAA//8A2P//IAEgAAASAAABIAEAEgASACABIAAAEgAA”但 iframe 仍為空白。

你能建議是什么原因造成的以及如何解決這個問題嗎？ 謝謝！

我嘗試過使用不同型號的前后通信，包括 json、ajax 等。 我還嘗試從 asp 服務器端更新 iframe src，但由於內容變量是正確的，我認為問題出在前端。

Answer 1

那么，目標是您“必須”使用 iframe，還是您關心？

我的意思是，為什么不直接放入一個圖像控件，甚至是一個“div”，然后將圖像字符串放入該 div 或圖像控件中呢？

所以，讓我們放下一個按鈕，然后說從數據庫中拉出一行，其中有一列帶有二進制圖像。 通過將該二進制圖像轉換為 base64 圖像字符串，我們可以隨意將該字符串推入圖像中。

所以，說這個標記：

        <asp:Button ID="Button1" runat="server" Text="Get Image" OnClick="Button1_Click" />
        <br />
        <h3>My Image control</h3>
        <asp:Image ID="Image1" runat="server" Width="350px" />
        <br />

        <h3>My div</h3>
        <div id="mydiv" runat="server">
        </div>

然后是后面的代碼：

protected void Button1_Click(object sender, EventArgs e)
{
    using (SqlConnection conn = new SqlConnection(Properties.Settings.Default.TEST4))
    {
        string strSQL =
            "SELECT ID, MyImage FROM Fighters WHERE ID = 4";
        using (SqlCommand cmdSQL = new SqlCommand(strSQL, conn))
        {
            conn.Open();
            DataTable rstData = new DataTable();
            rstData.Load(cmdSQL.ExecuteReader());
            string PicString = 
                @"Data:Image/png;base64," + Convert.ToBase64String((byte[])rstData.Rows[0]["MyImage"]);

            Image1.ImageUrl = PicString;        // shove into image control

            Image MyImage = new Image();
            MyImage.Width = 200;
            MyImage.ImageUrl = PicString;
            mydiv.Controls.Add(MyImage);          // add image to "div"
        }
    }
}

所以，現在當我們點擊按鈕時，我們得到這個：

所以，是否需要/想要 iFrame 還不是很清楚？？？