显示大型Base64图像MVC 4 DOTNET

时间:2018-04-30 17:14:57

标签: jquery asp.net .net asp.net-mvc asp.net-mvc-4

首先,我在SSMS上将一些图像存储为二进制文件,这些图像以字节大小超过10K的字节格式存储。

到目前为止,我已经尝试了一些将在下面列出的技术。

注意我已经读过渲染时的base64图像通常用于64到64个实例的小型基本类型图像。

问题不是要将图像转换为base64,而是要找到一种方法,我使用Jquery逐个从数据库请求图像,然后添加将base64映像到DOM上的Image属性。

//注意:请求的图像从api端转换为base64,但图像二进制文件可能很大,因此当检查文件大小太大时,Base64总是在浏览器img src属性上返回大。

请不要指出我说它用于小图片我正在寻找一个解决方案,有人让它使用更大的图像。

调整大小不是它的选项会导致文档分辨率无法查看。虽然如果有解决方案,你可以指出我。我试图调整图像的大小只是为了让你知道,但是如果伸展那么图像在呈现时会像素一样明显。

请记住我要求更好的方法,或者我是否可以使用带有大型Base64的Jquery在dom上加载多个图像。

我也知道我可以使用链接显示图像列表,然后允许用户单击链接以查看该特定图像。

我正在使用Dotnet 4.5 MVC

我所尝试的代码:

    $(function () {
    $(".my-image-tag").each(function () {
        var img = $(this);
        var apiUrl = "www.xxxx.com";
        console.log(
            $.ajax({
                type: 'GET',
                url: apiUrl ,
                data: { 'Id': img.attr('data-id') },
            }).done(function (data) {
                console.log(data.Image);
                img.attr('src', 'data:image/jpg;base64,' + data.Image);
            }).error(function (jqXHR, textStatus, errorThrown) {
                ///Need a Error Logger Page
            })
        );
    });
});

1 个答案:

答案 0 :(得分:2)

正如Rup在评论中建议的那样,您最好的选择可能是在API中为图像提供一种方法。

<img src="/controller/getimage/imagename">

然后在你的控制器中就像......

public ActionResult getimage(string imagename)
{
   var data = //call database to get image data
   var file = //convert data into File "image/jpeg" or whatever file type you use
   return file;
}