Question

我有一个数据库，其中包含用于存储blob jpeg图像数据的字段（即：FFD8FFE00010 ...）。我可以毫无问题地拉出数据，转换为字节数组和base64字符串。但是当显示图像时，它不到图像的一半。看起来很大一部分转换会切断图像。

以下是我一直在使用的示例：

$.ajax({
        url: "../queries/getContactImage.ashx",
        contentType: "application/json; charset=utf-8",
        cache: false,
        dataType: "json",
        data: {
            iID: pID
        },
        responseType: "json",
        success: function (response) {

            // Loop Through Values And Build String
            if (response.length != 0) {
                $.each(response.aaData, function (index, row) {

                    // CONVERT BLOB TO BYTE[] ARRAY
                    var buffer = [];
                    for (var i = 0; i < row.cPHOTO.length / 2 - 1; i++) {
                        var twoByte = row.cPHOTO.substring((i * 2), (i * 2) + 2);
                        buffer.push(parseInt(twoByte, 16));
                    }
                    console.log(buffer);    

                    // CONVERT TO BASE64STRING
                    var binary = '';
                    var bytes = new Uint8Array(buffer);
                    var len = bytes.byteLength;
                    for (var i = 0; i < len; i++) {
                        binary += String.fromCharCode(bytes[i]);
                    }
                    var base64String = window.btoa(binary);

                    // THIS ONLY DISPLAYS PART OF THE IMAGE ...
                    $("#lstPicture").append("<img src='data:Image/jpeg;base64," + base64String + "' class='img-responsive pic-bordered'/></img>");

                });
            }

        },
        error: function () {
            alert('Contact Image Cannot Be Retrieved.');
        },
    });

如何显示完整图像？是否存在尺寸限制问题？

- 编辑 -

我尝试在服务器上进行转换（下面的代码），但图像被切断了..

Byte[] bytes = new Byte[rdr["cPhoto"].ToString().Length / 2 ]; 
for (int i = 0; i < bytes.Length; i++) { 
    bytes[i] = Convert.ToByte(rdr["cPhoto"].ToString().Substring(i * 2, 2), 16); 
} 
results.cPHOTO = Convert.ToBase64String(bytes);

Answer 1

http://www.aspsnippets.com/Articles/Save-and-Retrieve-BLOB-Images-from-MySql-Database-in-ASPNet-C-and-VBNet.aspx

请参考我认为这将帮助您摆脱它，您可以在不使用Handler的情况下实现这一目标。

Answer 2

如果您正在寻找将数据转换为base64的功能，请使用btoa(..)功能。它通过window对象全局可用。

btoa('hello')
// => "aGVsbG8="

atob('aGVsbG8=')
// => "hello"

正如此示例所示，atob(..)与btoa(..)相反。 Here's a link到MDN上的文档。

将SQL DB Blob图像加载到网页中

2 个答案: