Kann Bilder von GridFS anzeigen, PyMongo

Question

Hallo alle, ich bin ein bisschen neu in Python. Also habe ich ein verwirrtes Problem für mich. Ich muss das Bild in der Datenbank speichern, und danach muss ich jedes Bild auf der Client-Seite anzeigen. Ich benutze Flask für Ruhe Anfrage.

So, hier habe ich meinen simpl marckup für submitind

<form action="/upload" method="post" enctype="multipart/form-data"> 
    <label for="image">Select image</label> 
    <input type="file" name='img' id='image'> 
    <input type="submit" id='upload_img'> 
</form> 

und hier hat ich meine Anfrage bekommen und es zu meiner DB

@app.route("/upload", methods=["POST"]) 
def upload_image(): 
    # get current image file 
    img_file = request.files['img'] 
    # get Content Type and File Name of current image 
    content_type = img_file.content_type 
    filename = img_file.filename 

    # save to GridFS my image 
    # fields <-- recive the id of just saved image 
    fields = db.FS.put(img_file, content_type=content_type, filename=filename) 
    # store the filename and _id to another database 
    # so here we can much morea easaly get image from our GridFS 
    db.Mongo['images'].insert({"filename": filename, "fields": fields}) 

    return index(images=[]) 

Mein einfaches Datenbankmodell

speichern

class db(object): 
    URI = "mongodb://localhost:27017" 
    Mongo = None 
    FS = None 

    @staticmethod 
    def initialize(): 
     client = pymongo.MongoClient(db.URI) 
     db.Mongo= client['gallery'] 
     db.FS = GridFS(Database.DATABASE) 

Und alle speichert ist erfolgreich.

mein Bild von DB retrive und versuchen Sie es

@app.route('/get_all_images') 
    def get_image(): 
    images = db.Mongo['gallery'].find({}) 
    # try to get just a first image _id and fing it at GridFS files 
    image = db.FS.get(images[0]["fields"]) 
    #send to the client 
    return index(images=image.read()) 

ist Markup aus der Antwort zur Anzeige Bild hier auf clietn zu senden

<div> 
     <img src="data:image/png;base64,{{images}}" alt=""> 
     <div>{{images}}</div> 
    </div> 

und finnaly ich so etwas wie dieses erhalten enter image description here

Die Antwort sieht wie folgt aus: b \ x89PNG \ r \ n \ x1a \ n \ x00 \ x00 \ x00 \ rIHDR \ x00 \ x00 \ x00w \ x00 \ x00 \ x00 \ x7f \ x08 \ x06 \ x00 \ x00 \ x00 \ xd5j] \ XE7 \ x00 \ x00 \ x00 \ x19tEXtSoftware \ x00Adobe ImageReadyq \ xc9e < \ x00 \ x00 \ x03" iTXtXML: com.adobe.xmp \ x00 \ x00 \ x00 \ x00 \ x00

Die problam ist, dass ich kann nicht herausfinden, wie man dieses Byte-Format in echtes Bild umwandelt und es auf einer Webseite direkt aus der Datenbank anzeigt.

Ich versuche, mehrere Varianten zu machen, um dieses Problem zu lösen ... aber in einigen, wie mein Verstand explodiert..und ich verstehe wirklich nicht, wie man damit arbeitet.

Vielen Dank für Ihre Zeit :)

IF somebady keine IDIAS oder Ratschläge, wie ich Bilder aus der Datenbank in Client-Seite zeigen kann ...

Answer 1

ich es tun !!! :) Ich finde heraus, wie ich das selbst beheben kann.

Eigentlich war das Problem in meiner Antwort ... und in einigen Fällen auch auf der Client-Seite. Denn wenn ich Anfrage vom Server senden, ich die Daten in Byte Format senden

print(type(image.read())) 
<class 'bytes'> 

während auf dem Client ich das so etwas wie binnary String

<img src="data:image/png;base64,{{images}}" alt=""> 

Es vorgeschlagen ist meine Lösungen Code

import codecs 
base64_data = codecs.encode(image.read(), 'base64') 
image = base64_data.decode('utf-8') 

Und auf dem Client reve th die Zeichenfolge, die ich an die img Tag einfügen ... und Taddaaaa habe ich Bild von meinem db.

Vielen Dank an alle, die versuchen, mir zu helfen oder herauszufinden, wie ich mein Problem beheben kann. Ich bin nicht sicher, dass das die beste Praxis ist, aber es funktioniert.

P.S. Entschuldigung für mein Englisch: P