有没有办法将 PIL 字符串字节转换为我的 Web 应用程序上的可视图像？

Question

我已经通过 toBytes() 在我的 Flask 服务器上将 PIL 图像编组为字节。

然后这些字节作为字符串嵌入 Json 并通过 http 传输到我的 Angular 网络应用程序。

有没有办法将此二进制文件转换为我的网络应用程序上的可视图像？或者是否有更好的方法将图像从我的 Flask 服务器传输到我的 Angular 网络应用程序？

Answer 1

我的部分代码python flask代码：

    imgByteArrTemp = io.BytesIO()
    img.save(imgByteArrTemp, format="PNG")
#        imgByteArrTemp = base64.b64encode(imgByteArrTemp.getvalue())
    imgByteArrTemp = imgByteArrTemp.getvalue()

我的GET方法：

@app.route("/get-resulting-image", methods=["GET"]) 
def get_resulting_image(): 
    global q 
    if not q.empty(): 
        item = q.get() 
        return send_file(io.BytesIO(item),
                mimetype = "image/png",
                as_attachment=True,
                download_name="%s.png")
    return "no image to provide"

我的打字稿app.component.ts:

createImageFromBlob(image:Blob){
    let reader = new FileReader();
    reader.addEventListener("load", () => {
        this.imageBinary = reader.result;
        console.log(this.imageBinary);
    },false);
    if (image){
        reader.readAsDataURL(image);
    }
}   
getResponse(){
 ...
this.restService.getCorrespondingImage().subscribe( 
                            data1 => {
                                this.createImageFromBlob(data1);
                                this.isImageLoading = false;
                            },
                            error => {
                                this.isImageLoading = false;
                                console.log(error)
                            }
                        );
 ...
}

app.component.html

<img [src]="imageBinary" *ngIf="!isImageLoading">

rest.service.ts

import { Injectable } from '@angular/core';
import {HttpClient} from '@angular/common/http';
import {Observable, throwError} from 'rxjs';
import {catchError, retry} from 'rxjs/operators';
@Injectable({
    providedIn: 'root'
})
export class RestService {

    constructor(private http: HttpClient) { } 

....
    getCorrespondingImage():Observable<Blob>{
        return this.http.get(
            "http://192.168.1.2:9500/get-resulting-image",
            {responseType:"blob"});
    }   
}

希望这可以帮助那里的人。

有没有办法将 PIL 字符串字节转换为我的 Web 应用程序上的可视图像？

Is there a way to turn PIL string bytes into a viewable image on my web application?

python

python-imaging-library

angular