Angular 2 Typescript从文件系统转换问题中检索jpeg图像

时间:2018-11-16 23:09:00

标签: angular image base64 blob httpclient

由于我通常从提供数据库数据的HTTP响应中正常获取图像数据的方式,因此它是图像的base64编码值。如果不存在,我将尝试替换默认图像。

显示图像的html示例如下:

        <img [src]="'data:'+sample.mimetype+';base64,'+sample.value"
                alt="" width="75%"  />

我正在进行的检索图像的调用返回了一个Blob。 (请注意,我目前正在查看整个响应,只是为了帮助您弄清楚我得到了什么)。如果答案是使用其他类型的图像响应,那我真是听不懂。这是当前从文件系统检索图像的调用。

    return this.httpClient
        .get<any>('./assets/images/face-not-avail.jpg', {observe: 'response', responseType: 'blob' })
        .map(response =>{
            console.log('face response ' + response);
            return response.body;
        })
        .catch(this.errorHelperService.handleError);

以下是图像响应的内容: enter image description here

但是我很难弄清楚如何将那个blob转换成我通常要处理的base64编码值attrubute的类型。我不会列出我尝试过的所有内容...但是我似乎无法访问Blob数据。斑点类型为image / jpeg。

我一直在环顾四周,但似乎没有合适的位置。

任何建议将不胜感激。

0 个答案:

没有答案