使用Javascript（MVC）負載從數據庫

圖像（字節數組）有很多答案在這裏對堆棧這個問題，但他們都不是爲我工作...使用Javascript（MVC）負載從數據庫

我需要設置「源」屬性一個javascript字節數組中的圖像標籤，我通過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）字節數組到一個圖像標籤？

預先感謝您的幫助

來源

2015-05-24 Trenton

很多遊戲，一個良好的夜間睡眠和一點點運氣之後，這裏是解決方案。

我需要爲我的模型添加一個字符串屬性，將其稱爲「ImageBytesAsString」，並將src設置爲我的ajax響應。這裏是代碼..

MODEL：

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); 
    } 
});

VIEW：

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

我希望這可以幫助別人。

來源

2015-05-25 14:35:22 Trenton

使用Javascript（MVC）負載從數據庫

回答

相關問題