Google App Engine：显示存储在数据存储区中的图像

Question

I've created an entity 'Images' which stored the file name and a blob object for storing images: 我创建了一个实体“ Images”，该实体存储了文件名和一个用于存储图像的Blob对象：

class Images(ndb.Model):
    file_name = ndb.StringProperty()
    blob = ndb.BlobProperty()

Now, I have tried to display the 'database.jpeg' image in my application as follows: 现在，我尝试在应用程序中显示“ database.jpeg”图像，如下所示：

HTML form HTML表格

<html>
<head>
    <title>Template</title>
</head>
<body>
    <img src="/img_serve/database.jpeg" /> 
</body>
</html>

Python file: Python档案：

class ImgServe(Handler):
    def get(self, resource):
        image = ndb.Key('Images', resource).get()
        self.response.headers[b'Content-Type'] = mimetypes.guess_type(image.file_name)[0]
        self.response.write(image.blob)  

app = webapp2.WSGIApplication([('/', MainPage),
                                ('/signup', Register),
                                ('/login', Login),
                                ('/logout', Logout),
                                ('/mp', MP),
                                (r'/file_upload', FileUpload),
                                ('/blob', Blob),
                                (r'/img_serve/<resource:(.*)>', ImgServe),
                                ('/template', Template)], debug=True)

Here's a screenshot of the 'Images' entity: 这是“图片”实体的屏幕截图：

在此处输入图片说明

However, I get a broken image in my application. 但是，我的应用程序中出现了损坏的图像。 What seems to be the problem in my code? 我的代码中似乎有什么问题？

The whole code: 整个代码：

main.py

import os
import re
import random
import hashlib
import hmac
from string import letters
import mimetypes
import webapp2
import jinja2

from google.appengine.ext import ndb

template_dir = os.path.join(os.path.dirname(__file__), 'templates')
jinja_env = jinja2.Environment(loader = jinja2.FileSystemLoader(template_dir),
                               autoescape = True)

secret = 'fart'

def render_str(template, **params):
    t = jinja_env.get_template(template)
    return t.render(params)

def make_secure_val(val):
    return '%s|%s' % (val, hmac.new(secret, val).hexdigest())

def check_secure_val(secure_val):
    val = secure_val.split('|')[0]
    if secure_val == make_secure_val(val):
        return val

class Handler(webapp2.RequestHandler):
    def write(self, *a, **kw):
        self.response.out.write(*a, **kw)

    def render_str(self, template, **params):
        params['user'] = self.user
        return render_str(template, **params)

    def render(self, template, **kw):
        self.write(self.render_str(template, **kw))

    def set_secure_cookie(self, name, val):
        cookie_val = make_secure_val(val)
        self.response.headers.add_header(
            'Set-Cookie',
            '%s=%s; Path=/' % (name, cookie_val))

    def read_secure_cookie(self, name):
        cookie_val = self.request.cookies.get(name)
        return cookie_val and check_secure_val(cookie_val)

    def login(self, user):
        self.set_secure_cookie('user_id', str(user.key().id()))

    def logout(self):
        self.response.headers.add_header('Set-Cookie', 'user_id=; Path=/')

    def initialize(self, *a, **kw):
        webapp2.RequestHandler.initialize(self, *a, **kw)
        uid = self.read_secure_cookie('user_id')
        self.user = uid and User.by_id(int(uid))

class MainPage(Handler):
    def get(self):
        self.render("home.html")

##### user stuff
def make_salt(length = 5):
    return ''.join(random.choice(letters) for x in xrange(length))

def make_pw_hash(name, pw, salt = None):
    if not salt:
        salt = make_salt()
    h = hashlib.sha256(name + pw + salt).hexdigest()
    return '%s,%s' % (salt, h)

def valid_pw(name, password, h):
    salt = h.split(',')[0]
    return h == make_pw_hash(name, password, salt)

def users_key(group = 'default'):
    return ndb.Key.from_path('users', group)

class Images(ndb.Model):
    file_name = ndb.StringProperty()
    blob = ndb.BlobProperty()

class User(ndb.Model):
    name = ndb.StringProperty(required = True)
    pw_hash = ndb.StringProperty(required = True)
    email = ndb.StringProperty()

    @classmethod
    def by_id(cls, uid):
        return User.get_by_id(uid, parent = users_key())

    @classmethod
    def by_name(cls, name):
        u = User.all().filter('name =', name).get()
        return u

    @classmethod
    def register(cls, name, pw, email = None):
        pw_hash = make_pw_hash(name, pw)
        return User(parent = users_key(),
                    name = name,
                    pw_hash = pw_hash,
                    email = email)

    @classmethod
    def login(cls, name, pw):
        u = cls.by_name(name)
        if u and valid_pw(name, pw, u.pw_hash):
            return u


USER_RE = re.compile(r"^[a-zA-Z0-9_-]{3,20}$")
def valid_username(username):
    return username and USER_RE.match(username)

PASS_RE = re.compile(r"^.{3,20}$")
def valid_password(password):
    return password and PASS_RE.match(password)

EMAIL_RE  = re.compile(r'^[\S]+@[\S]+\.[\S]+$')
def valid_email(email):
    return not email or EMAIL_RE.match(email)

class Signup(Handler):
    def get(self):
        self.render("signup-form.html")

    def post(self):
        have_error = False
        self.username = self.request.get('username')
        self.password = self.request.get('password')
        self.verify = self.request.get('verify')
        self.email = self.request.get('email')

        params = dict(username = self.username,
                      email = self.email)

        if not valid_username(self.username):
            params['error_username'] = "That's not a valid username."
            have_error = True

        if not valid_password(self.password):
            params['error_password'] = "That wasn't a valid password."
            have_error = True
        elif self.password != self.verify:
            params['error_verify'] = "Your passwords didn't match."
            have_error = True

        if not valid_email(self.email):
            params['error_email'] = "That's not a valid email."
            have_error = True

        if have_error:
            self.render('signup-form.html', **params)
        else:
            self.done()

    def done(self, *a, **kw):
        raise NotImplementedError

class Register(Signup):
    def done(self):
        #make sure the user doesn't already exist
        u = User.by_name(self.username)
        if u:
            msg = 'That user already exists.'
            self.render('signup-form.html', error_username = msg)
        else:
            u = User.register(self.username, self.password, self.email)
            u.put()

            self.login(u)
            self.redirect('/')

class Login(Handler):
    def get(self):
        self.render('login-form.html')

    def post(self):
        username = self.request.get('username')
        password = self.request.get('password')

        u = User.login(username, password)
        if u:
            self.login(u)
            frontuser = username
            self.render('home.html', frontuser = frontuser)
        else:
            msg = 'Invalid login'
            self.render('login-form.html', error = msg)

class Logout(Handler):
    def get(self):
        self.logout()
        self.redirect('/')

class MP(Handler):
    def get(self):
        self.render('mp.html')

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)

class ImgServe(Handler):
    def get(self, resource):
        image = ndb.Key('Images', resource).get()
        self.response.headers[b'Content-Type'] = mimetypes.guess_type(image.file_name)[0]
        self.response.write(image.blob)            

class Blob(Handler):
    def get(self):
        self.render("blob.html")

class Template(Handler):
    def get(self):
        self.render('template.html')


app = webapp2.WSGIApplication([('/', MainPage),
                                ('/signup', Register),
                                ('/login', Login),
                                ('/logout', Logout),
                                ('/mp', MP),
                                (r'/file_upload', FileUpload),
                                ('/blob', Blob),
                                (r'/img_serve/<resource:(.*)>', ImgServe),
                                ('/template', Template)], debug=True)

blob.html blob.html

<!DOCTYPE HTML>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Image Upload</title>
</head>
<body>
<form action="/file_upload" enctype="multipart/form-data" method="post">
    <div><input type="file" name="file"/></div>
    <div><input type="submit" value="Upload"></div>
</form>
</body>
</html>

template.html template.html

<html>
<head>
    <title>Template</title>
</head>
<body>
    <img src="/img_serve/database.jpeg" /> 
</body>
</html>

Also, here's what I get instead of an image: 另外，这是我得到的而不是图像：

在此处输入图片说明

Answer 1

Using App engine SDK 1.9.0 and Python 27 the SDK datastore should look like this after uploading an image with your upload code and file_name: clock.png. 使用App Engine SDK 1.9.0和Python 27，在上传包含您的上传代码和file_name：clock.png的图片后，SDK数据存储应如下所示。 在此处输入图片说明

In your code : class FileUpload(Handler) and class ImgServe(Handler): 在您的代码中： class FileUpload(Handler)和class ImgServe(Handler):

But why not use webapp2.RequestHandler for Handler? 但是，为什么不将webapp2.RequestHandler用于处理程序呢？

Using this static HTML: 使用此静态HTML：

<!DOCTYPE HTML>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Image Serving</title>
</head>
<body>
   <img src="/img_serve/clock.png" alt="clock" >
</body>
</html>

And this handler: 这个处理程序：

class ImgServe(webapp2.RequestHandler):

    def get(self, resource):
        image = ndb.Key('Images', resource).get()
        self.response.headers[b'Content-Type'] = mimetypes.guess_type(image.file_name)[0]
        self.response.write(image.blob)

Routing: 路由：

    webapp2.Route(r'/img_serve/<resource:(.*)>', handler=....ImgServe)

Answer 2

I would recommend that you use a Blobstore for storing images - it's cheaper and it's specifically optimized for this purpose. 我建议您使用Blobstore来存储图像-价格便宜，并且为此专门优化。

Better yet, you can store images in Google Cloud Storage. 更好的是，您可以将图像存储在Google Cloud Storage中。 It's even cheaper than Blobstore. 它甚至比Blobstore便宜。

Both solutions offer an additional benefit - browsers will be able to cache these images. 两种解决方案都提供了额外的好处-浏览器将能够缓存这些图像。

Google App Engine：显示存储在数据存储区中的图像

问题描述

2 个解决方案

解决方案1
0 2014-03-09 13:52:45

解决方案2
0 2014-03-09 14:24:31

Google App Engine：显示存储在数据存储区中的图像

问题描述

2 个解决方案

解决方案1 0 2014-03-09 13:52:45

解决方案2 0 2014-03-09 14:24:31

解决方案1
0 2014-03-09 13:52:45

解决方案2
0 2014-03-09 14:24:31