title: Google App Engine: Storing images in database (Python)
body: <p>I'm creating an ecommerce platform on Google App Engine using Python. For that, I need to store the details of the products I will be offering in a separate entity, which will also include an image of every individual product. Now, how do I store images in the datastore? Also, more importantly, how do I extract images from the database and display it for the user on my application?</p>
  
  <p>EDIT:</p>
  
  <p>After uploading my image into an 'Images' entity, I was trying to display it. Here's the code for the same:</p>
  
  <p>main.py</p>
  
  <pre><code>class FileUpload(Handler):
      def post(self):
          file_upload = self.request.POST.get("file", None)
          file_name = file_upload.filename
          image = Images(id=file_name, file_name=file_name, blob=file_upload.file.read())
          image.put()
  
          self.response.headers[b'Content-Type'] = mimetypes.guess_type(image.file_name)[0]
          self.response.write(image.blob)
          self.final()
  
      def final(self):
          images = db.GqlQuery("Select * FROM Images WHERE file_name = 'CN.jpg'")
          self.render("template.html", images = images)
  
  class Blob(Handler):
      def get(self):
          self.render("blob.html")
  
  
  app = webapp2.WSGIApplication([('/', MainPage),
                                  ('/signup', Register),
                                  ('/login', Login),
                                  ('/logout', Logout),
                                  ('/mp', MP),
                                  (r'/file_upload', FileUpload),
                                  ('/blob', Blob)], debug=True)
  </code></pre>
  
  <p>template.html</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;Template&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      {%
          for image in images
      %}
      &lt;div&gt;{{image.blob}}&lt;/div&gt;
      {%endfor%}
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>blob.html</p>
  
  <pre><code>&lt;!DOCTYPE HTML&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt;
      &lt;title&gt;Image Upload&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;form action="/file_upload" enctype="multipart/form-data" method="post"&gt;
      &lt;div&gt;&lt;input type="file" name="file"/&gt;&lt;/div&gt;
      &lt;div&gt;&lt;input type="submit" value="Upload"&gt;&lt;/div&gt;
  &lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Now, in template.html, I was expecting the image I was trying to extract to be displayed. However, I get the following error:</p>
  
  <pre><code>&lt;div&gt;{{image.blob}}&lt;/div&gt;
  UnicodeDecodeError: 'ascii' codec can't decode byte 0xff in position 0: ordinal not in range(128)
  </code></pre>