如何使用jquery将json显示为图像?

时间:2013-11-21 17:23:21

标签: jquery wcf-rest

我有一个WCF Web服务,它将图像作为json返回。

[OperationContract]
        [WebGet(UriTemplate = "Service/GetCarList")]
        public List<CarModel> GetCarList()
        {

            var carList = _db.Cars.ToList();
            var carPhotos = _db.CarPhotoes.ToList();
            return carList.Select(car => new CarModel
            {
                Id = car.CarId,
                Model = car.Model,
                Images = carPhotos.Where(m => m.CarId == car.CarId).Select(m => m.CarPhoto1).ToList()
            }).ToList();
        } 

我已尝试通过以下方式在DOM中显示

@{
    ViewBag.Title = "Home Page";
}
<script src="@Url.Content("~/Scripts/jquery-1.10.2.js")" type="text/javascript"></script>

<div id="divMyLetterImage"></div>


<script type="text/javascript">

    var getCarUrl = 'http://localhost:62051/Service/GetCarList';

    $(document).ready(function () {

        $.ajax({
            cache: false,
            type: "GET",
            dataType: "json",
            url: getCarUrl,
            success: function (response) {

                var imag = "<img "
                          + "src='" + "data:image/jpg;base64,"
                          + response[0].Images[0] + "'/>";
                $("#divMyLetterImage").replaceWith(imag);
                alert(response[0].Images[0]);
            },
            error: function (xhr) {
                alert(xhr.responseText);
            }
        });

    });
</script>

response[0].Images[0]给我回复

255,216,255,224,0,16,74,70,73,70,0,1,1,1,0,96,0,96,0,0,255,236,0,17,68,117,99,10‌​7,121,0,1,0,4,0,0,0,60,0,0,255,219,0,67,0,2,1,1,2,1,1,2,2,2,2,2,2,2,2,3,5,3,3,3,3‌​,3,6,4,4,3,5,7,6,7,7,7,6,7,7,8,9,11,9,8,8,10,8,7,7,10,13,10,10,11,12,12,12,12,以及更多

但它不起作用........我该怎么办?

1 个答案:

答案 0 :(得分:0)

我相信你的路线:

Images = carPhotos.Where(m => m.CarId == car.CarId).Select(m => m.CarPhoto1).ToList()

错误,您应该返回base64编码的字符串。显然(根据您的评论),您可以通过调用.ToList()表示特定字节的数字列表来获得,但您需要返回Base64编码的字符串。方法Convert.ToBase64String可能对此有用。