Exemplos da Images API

Saiba como enviar, transformar, armazenar e disponibilizar imagens dinamicamente usando a Images API. Com este exemplo, estendemos o exemplo de livro de visitas do guia de primeiros passos e o modificamos para permitir que o usuário faça upload de um avatar com a própria saudação.

Como criar um modelo de imagem no Datastore

Você precisa atualizar o modelo a partir do exemplo de livro de visitas para armazenar a imagem enviada como um blob.

class Greeting(ndb.Model):
    """Models a Guestbook entry with an author, content, avatar, and date."""
    author = ndb.StringProperty()
    content = ndb.TextProperty()
    avatar = ndb.BlobProperty()
    date = ndb.DateTimeProperty(auto_now_add=True)

Como fazer upload de imagens do usuário

Você precisará modificar o formulário HTML para permitir que o usuário faça upload de uma imagem:

  1. Adicione um campo que permita ao usuário selecionar um arquivo do computador para upload.

  2. Adicione o atributo enctype à tag de formulário e especifique que se trata de uma postagem de formulário com várias partes.

    self.response.out.write("""
          <form action="/sign?%s"
                enctype="multipart/form-data"
                method="post">
            <div>
              <textarea name="content" rows="3" cols="60"></textarea>
            </div>
            <div><label>Avatar:</label></div>
            <div><input type="file" name="img"/></div>
            <div><input type="submit" value="Sign Guestbook"></div>
          </form>
          <hr>
          <form>Guestbook name: <input value="%s" name="guestbook_name">
          <input type="submit" value="switch"></form>
        </body>
      </html>""" % (urllib.urlencode({'guestbook_name': guestbook_name}),
                    cgi.escape(guestbook_name)))
  3. Atualize o gerenciador do livro de visitas para receber os dados de imagem da postagem do formulário e armazená-los como um blob no armazenamento de dados.

    class Guestbook(webapp2.RequestHandler):
        def post(self):
            guestbook_name = self.request.get('guestbook_name')
            greeting = Greeting(parent=guestbook_key(guestbook_name))
    
            if users.get_current_user():
                greeting.author = users.get_current_user().nickname()
    
            greeting.content = self.request.get('content')
    
            avatar = self.request.get('img')
            avatar = images.resize(avatar, 32, 32)
            greeting.avatar = avatar
            greeting.put()
    
            self.redirect('/?' + urllib.urlencode(
                {'guestbook_name': guestbook_name}))

Como transformar imagens

Para criar avatares de 32 x 32, siga estas etapas:

  1. Importe o módulo google.appengine.api.images.

    from google.appengine.api import images
  2. Chame a função e resize e passe os dados da imagem.

    avatar = images.resize(avatar, 32, 32)

Como disponibilizar imagens dinamicamente

Para disponibilizar imagens, siga estas etapas:

  1. Crie um gerenciador de imagens que disponibilize dinamicamente imagens fora do caminho /img.

    class Image(webapp2.RequestHandler):
        def get(self):
            greeting_key = ndb.Key(urlsafe=self.request.get('img_id'))
            greeting = greeting_key.get()
            if greeting.avatar:
                self.response.headers['Content-Type'] = 'image/png'
                self.response.out.write(greeting.avatar)
            else:
                self.response.out.write('No image')
  2. Atualize o HTML para exibir essas imagens disponibilizadas dinamicamente.

    self.response.out.write('<div><img src="/img?img_id=%s"></img>' %
                            greeting.key.urlsafe())
    self.response.out.write('<blockquote>%s</blockquote></div>' %
                            cgi.escape(greeting.content))

Você precisará atualizar o HTML do livro de visitas para passar a chave da saudação para o gerenciador de imagem, já que ele recebe o img_id da solicitação.

Como implantar o aplicativo no App Engine

Para fazer upload do aplicativo guestbook, execute o seguinte comando no diretório guestbook do aplicativo, em que os arquivos app.yaml e index.yaml estão localizados:

gcloud app deploy app.yaml index.yaml

Os índices do Datastore podem levar algum tempo para serem gerados antes que o aplicativo fique disponível. Se os índices ainda estiverem sendo gerados, você receberá uma mensagem do NeedIndexError ao acessar o aplicativo. Trata-se de um erro temporário, portanto, se recebê-lo, tente novamente mais tarde.

Para saber mais sobre como implantar o aplicativo na linha de comando, consulte Como implantar um aplicativo Python.

Como visualizar o aplicativo implantado

Para iniciar o navegador e ver o app em http://[YOUR_PROJECT_ID].appspot.com, execute o seguinte comando:

gcloud app browse
Esta página foi útil? Conte sua opinião sobre:

Enviar comentários sobre…

Ambiente padrão do App Engine para Python 2