将响应转换为新图像

时间:2017-04-18 11:46:27

标签: javascript angular

有没有办法将HTTP Get响应转换为Image()对象?

目前我使用:

backImage = new Image()
backImage.src = "http://www.example.com/someimage.jpg";

我想使用我的网络API(提供HttpResponseMessage):

public HttpResponseMessage GetImage(Guid id)
        {
           // my logic and image extraction
           var file = new FileInfo("path-to-my-image");
           var fileStream = file.OpenRead();
           var response = new HttpResponseMessage { Content = new StreamContent(fileStream) };
                response.Content.Headers.ContentType = new MediaTypeHeaderValue("image/jpg");
                response.Content.Headers.ContentLength = file.Length;
                return response;
            }

我目前通过

调用
this.http.get("http://www.example.com/api/GetImage/"+id);

当我在Postman中测试时,我返回响应并渲染图像。

我试图找出是否有可能转换该响应并将其存储在Image()对象中作为示例。

2 个答案:

答案 0 :(得分:1)

您可以返回图片的base64值:

compile "com.android.support:support-core-utils:25.3.1"
compile 'com.android.support:support-v4:25.3.1'

客户端示例:

var returnString = "data:image/jpg;base64,"+Convert.ToBase64String(bytearray);

控制器示例:

this.http
 .get("http://www.example.com/api/GetImage/"+id)
 .then(x=>{
    backImage = new Image()
    backImage.src = x;
   //render
});

答案 1 :(得分:0)

以下是使用基于ID

返回图片的setgetgo API的示例
var img = new Image();
var generateImageId = () => Math.ceil(Math.random() * 100000);
img.src = "http://setgetgo.com/randomimage/get.php?key=" + generateImageId();
document.body.appendChild(img)

工作小提琴手link

要将图像保存到磁盘,请将此SO answer

保存