javascript - 如何将字节数组转换为图像?

标签 javascript ajax image wcf

使用 Javascript,我正在对 WCF 服务进行 AJAX 调用,它返回一个字节数组。如何将其转换为图像并将其显示在网页上?

最佳答案

我意识到这是一个旧线程,但我设法通过网络服务上的 AJAX 调用来做到这一点,并认为我会分享......

  • 我的页面中已经有一张图片:
     <img id="ItemPreview" src="" />
    
  • Ajax :
    $.ajax({
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            timeout: 10000,
            url: 'Common.asmx/GetItemPreview',
            data: '{"id":"' + document.getElementById("AwardDropDown").value + '"}',
            success: function (data) {
                if (data.d != null) {
                    var results = jQuery.parseJSON(data.d);
                    for (var key in results) {
                        //the results is a base64 string.  convert it to an image and assign as 'src'
                        document.getElementById("ItemPreview").src = "data:image/png;base64," + results[key];
                    }
                }
            }
        });
    

  • 我的“GetItemPreview”代码查询一个 SQL 服务器,其中我将图像存储为 base64 字符串,并将该字段作为“结果”返回:
         string itemPreview = DB.ExecuteScalar(String.Format("SELECT [avatarImage] FROM [avatar_item_template] WHERE [id] = {0}", DB.Sanitize(id)));
         results.Add("Success", itemPreview);
         return json.Serialize(results);
    

    神奇之处在于这一行的 AJAX 调用:
         document.getElementById("ItemPreview").src = "data:image/png;base64," + results[key];
    

    享受!

    关于javascript - 如何将字节数组转换为图像?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4564119/

    相关文章:

    html - 如何创建覆盖纸(桩)- CSS/HTML

    javascript - AngularJS : Chaining promises

    javascript - 如何从我的 HTML 中删除 'white space text nodes'?

    javascript - 使用 Sweet-alert 消息和 Laravel 5.2 删除类别

    javascript - 在Nodejs中将base64 png转换为jpeg图像

    c++ - OpenCV:加速 EM 算法预测

    javascript - 查找时间 t 的所有数组元素

    javascript - 有没有一种方法可以用Javascript解析和比较weather.gov日期格式?

    javascript - 将 javascript 变量传递到融合图构造函数中

    javascript - 计算点击的复选框,即使在刷新后