Images API 範例

區域 ID

REGION_ID 是 Google 根據您在建立應用程式時選取的地區所指派的縮寫代碼。此代碼不對應至國家/地區或省份，即使部分區域 ID 可能與常用的國家/地區和省份代碼相似。如果是 2020 年 2 月後建立的應用程式，App Engine 網址會包含 REGION_ID.r。如果是這段時間前建立的現有應用程式，網址可選擇是否包含地區 ID。

進一步瞭解區域 ID。

瞭解如何使用 Images API，以動態的方式上傳、轉換、儲存及提供圖片。本範例說明如何將訊息發布到公開留言板，以及如何上傳附有問候語的個人資料相片。

在 Datastore 中建立圖片模型

您必須更新留言板範例中的模型，以 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)

上傳使用者圖片

您必須修改 HTML 表單，讓使用者上傳圖片：

  1. 新增欄位，讓使用者從電腦選取要上傳的檔案。

  2. 將 enctype 屬性新增至表單標記，並指定這是多部分表單發布。

    self.response.out.write("&quo<t;"
      form action="/sign?%s"
            enctype="multipart/form-d>ata"<
  >          m<ethod="post"
        div
       ><   textar>ea name=&<quot>;content&<quo><t; ro>ws=&quo<t;3&qu><ot; >cols=&quo<t;6><0"/textarea
        /div><
   >     divl<abe><lAvatar:/label/div
        divinput type=&><quot>;file&q<uot; >name=&q<uo>t;img&q<uot;>//div
        di<vinput type="submit" value=&>quot;Si<gn Guestbook"/div
      /form><
    >  hr
<     > fo<rmGue>stbook name: input value="%s" name="guestbook_name"
      input type="submit&quot; value="switch"/form
    /body
  /html""" % (urllib.urlencode({'guestbook_name': guestbook_name}),
                cgi.escape(guestbook_name)))

  3. 更新留言板處理常式以取得表單貼文中的圖片資料，並以 blob 形式將圖片資料儲存在資料儲存庫中。

    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(
            {9;guestbook_name': guestbook_name}))

轉換圖片

如要建立 32x32 顯示圖片，請按照下列步驟操作：

  1. 匯入 google.appengine.api.images 模組。

    from google.appengine.api import images

  2. 呼叫 resize 函式，並傳入圖片資料。

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

動態提供圖片

如要提供圖片，請按照下列步驟操作：

  1. 建立圖片處理常式，動態提供 /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. 更新 HTML 以顯示這類動態提供的圖片。

    self.response.out.write(&<#39><;divimg src="/img?i><mg_i>d=%s"/img' %
                        greeting.key.urlsafe())
self.re<sponse.out>.w<rite('b><lock>quote%s/blockquote/div' %
                        cgi.escape(greeting.content))

您需要更新留言簿的 HTML，將問候語的鍵傳遞至圖片處理常式，因為圖片處理常式會從要求取得 img_id。

將應用程式部署至 App Engine

如要上傳 guestbook 應用程式，請在應用程式的 guestbook 目錄 (即 app.yaml 和 index.yaml 檔案所在位置) 中執行下列指令：

gcloud app deploy app.yaml index.yaml

在應用程式正式上線前，可能需要花點時間才能產生 Datastore 索引。如果索引仍在產生中，存取應用程式時會收到 NeedIndexError 訊息。這項錯誤是暫時性的，因此如果一開始收到這項錯誤，請稍後再試一次。

如要進一步瞭解如何透過指令列部署應用程式，請參閱部署 Python 應用程式一文。

查看部署的應用程式

如要啟動瀏覽器並在 https://PROJECT_ID.REGION_ID.r.appspot.com 查看應用程式，請執行下列指令：

gcloud app browse