本頁面由 Cloud Translation API 翻譯而成。

為 Dialogflow 應用程式建構前端 Django 用戶端

1. 事前準備

在本程式碼研究室中，您將學習如何建構前端 Django 用戶端，為 Dialogflow 應用程式建立對話體驗。具體而言，您將執行下列操作：

下載、設定並執行 Django 前端用戶端。
設定要從 Django 前端用戶端呼叫的 Dialogflow 偵測意圖端點。
在 App Engine 中將應用程式部署至 Google Cloud。
測試是否已依使用者要求設定日曆邀請。

必要條件

請先完成下列程式碼研究室，才能繼續操作：

課程內容

如何設定及執行 Dialogflow 的 Django 前端用戶端
如何在 App Engine 中將 Django 前端用戶端部署至 Google Cloud
如何從自訂前端測試 Dialogflow 應用程式

建構項目

您將設定並執行 Dialogflow 的 Django 前端用戶端。
在 App Engine 中，您要將 Django 前端用戶端部署至 Google Cloud。
您將從該自訂前端測試 Dialogflow 應用程式。

軟硬體需求

對 Python 有基本瞭解
對 Dialogflow 的基本瞭解

2. 架構總覽

您將使用先前建構的 Appointment Scheduler 對話體驗，並為應用程式建立自訂前端。您將使用 Django 建構前端、在本機執行和測試，然後將其部署至 App Engine。

使用者會透過前端傳送預約要求，該要求會呼叫 Dialogflow DetectionIntent API，為要求的日期和時間設定預約。接著，Dialogflow 執行要求會傳送要求至 Google 日曆，以便設定個別預約，並透過 Dialogflow 將確認訊息傳回給使用者。

最終結果應如下所示：

3. 下載並執行前端應用程式

在電腦的本機終端機中輸入以下指令，將存放區複製到本機電腦：

git clone https://github.com/priyankavergadia/Django-Dialogflow-Appointment-Scheduler.git

變更為包含程式碼的目錄。您也可以透過 ZIP 格式下載範例，然後解壓縮。

cd Django-Dialogflow-Appointment-Scheduler

4. 設定本機環境

部署完成後，應用程式會使用 App Engine 標準環境內建的 Cloud SQL Proxy 與 Cloud SQL 執行個體進行通訊。不過，如要在本機測試應用程式，您就必須在開發環境安裝並使用 Cloud SQL Proxy 本機副本。詳情請參閱「關於 Cloud SQL Proxy」一文。

如要在 Cloud SQL 執行個體上執行基本的管理工作，您可以使用 MySQL 適用的 Cloud SQL 用戶端。

安裝 Cloud SQL Proxy

下載並安裝 Cloud SQL Proxy。在本機執行時，Cloud SQL Proxy 可用來連線至 Cloud SQL 執行個體。

下載 Proxy。

curl -o cloud_sql_proxy https://dl.google.com/cloudsql/cloud_sql_proxy.darwin.amd64

將 Proxy 設為可執行檔。

chmod +x cloud_sql_proxy

建立 Cloud SQL 執行個體

建立 MySQL 適用的 Cloud SQL 第二代執行個體。將執行個體命名為「polls-instance」或類似的內容執行個體可能需要幾分鐘的時間才能準備就緒。準備就緒之後，應該會顯示在執行個體清單中。
使用 gcloud 工具執行下列指令，其中 [YOUR_INSTANCE_NAME] 代表執行個體的名稱。請記下畫面上顯示的執行個體連線名稱值，其格式為 [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME].

gcloud sql instances describe [YOUR_INSTANCE_NAME]

或者，您可以按一下執行個體，查看「執行個體連線名稱」。

初始化 Cloud SQL 執行個體

使用上一步中的執行個體連線名稱啟動 Cloud SQL Proxy。將 [YOUR_INSTANCE_CONNECTION_NAME] 替換為您在上一個步驟中記下的值。這麼做會將本機電腦連線至執行個體，以進行本機測試。在本機測試應用程式時，讓 Cloud SQL Proxy 保持運作。

./cloud_sql_proxy -instances="[YOUR_INSTANCE_CONNECTION_NAME]"=tcp:3306

接著，建立新的 Cloud SQL 使用者和資料庫。

使用 Google Cloud 控制台，為名為 polls-instance 的 Cloud SQL 執行個體建立新資料庫。例如，您可以輸入「polls」(意見調查)做為名稱
使用 Cloud 控制台，為名為 polls-instance 的 Cloud SQL 執行個體建立新的使用者帳戶。

進行資料庫設定

開啟 mysite/settings.py 進行編輯。
將 [YOUR-USERNAME] 和 [YOUR-PASSWORD] 兩處，替換為您在上一節建立的資料庫使用者名稱和密碼。這有助於為 App Engine 部署和本機測試設定連至資料庫的連線。
在顯示 ‘HOST': ‘cloudsql/ [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME]' 的行中，將 [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME] 替換為您在上一節記錄的值。
執行下列指令，並複製輸出的執行個體連線名稱值，用於下一個步驟。

gcloud sql instances describe [YOUR_INSTANCE_NAME]

將 [YOUR-CONNECTION-NAME] 替換為您在上一節記錄的值。
將 [YOUR-DATABASE] 替換為您在上一節選擇的名稱。

# [START db_setup]
if os.getenv('GAE_APPLICATION', None):
    # Running on production App Engine, so connect to Google Cloud SQL using
    # the unix socket at /cloudsql/<your-cloudsql-connection string>
    DATABASES = {
        'default': {
            'ENGINE': 'django.db.backends.mysql',
            'HOST': '/cloudsql/[PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME]',
            'USER': '[YOUR-USERNAME]',
            'PASSWORD': '[YOUR-PASSWORD]',
            'NAME': '[YOUR-DATABASE]',
        }
    }
else:
    # Running locally so connect to either a local MySQL instance or connect to
    # Cloud SQL via the proxy. To start the proxy via command line:
    #     $ cloud_sql_proxy -instances=[INSTANCE_CONNECTION_NAME]=tcp:3306
    # See https://cloud.google.com/sql/docs/mysql-connect-proxy
    DATABASES = {
        'default': {
            'ENGINE': 'django.db.backends.mysql',
            'HOST': '127.0.0.1',
            'PORT': '3306',
            'NAME': '[YOUR-DATABASE]',
            'USER': '[YOUR-USERNAME]',
            'PASSWORD': '[YOUR-PASSWORD]'
        }
    }
# [END db_setup]

關閉並儲存 settings.py。

5. 服務帳戶設定

在 Dialogflow 的主控台中，按一下。在「一般」分頁中，按一下「專案 ID」旁邊的「Google Cloud」圖示。
依序點選「導覽選單」圖示 ⋮ >API 與服務 >憑證。
按一下「建立憑證」>服務帳戶。
在「服務帳戶詳細資料」中，輸入「appointment-scheduler」做為「服務帳戶名稱」，然後按一下「建立」。

在顯示「將專案存取權授予這個服務帳戶」的位置，按一下「繼續」略過該專案。
按一下「將存取權授予使用者 (選用)」下方的「建立金鑰」>「JSON」JSON>建立。

JSON 檔案會下載到您的電腦，您在下列設定章節中會用到這個檔案。

6. 設定要從應用程式呼叫的 Dialogflow 偵測意圖端點

將即時通訊資料夾中的 AppointmentScheduler.json 替換為您的憑證 JSON 檔案。
在聊天資料夾的 views.py 中，將 GOOGLE_PROJECT_ID = "<YOUR_PROJECT_ID>" 變更為您的專案 ID。

7. 在本機建構並執行應用程式

若要在本機電腦上執行 Django 應用程式，您必須設定 Python 開發環境，包括 Python、pip 和 virtualenv。如需操作說明，請參閱「設定 Python 開發環境」一文。

建立獨立的 Python 環境，並安裝依附元件：

virtualenv env
source env/bin/activate
pip install -r requirements.txt

執行 Django 遷移作業以設定模型。

python3 manage.py makemigrations
python3 manage.py makemigrations polls
python3 manage.py migrate

啟動本機網路伺服器。

python3 manage.py runserver

在網路瀏覽器中輸入 http://localhost:8000/。您應該會看到一個簡易網頁，如以下螢幕截圖所示：

範例應用程式頁面是由在您電腦上執行的 Django 網路伺服器提供。當您準備好繼續時，請按下 Control+S (在 Macintosh 上為 Command+S) 停止本機網路伺服器。

8. 將應用程式部署至 App Engine 標準環境

執行下列指令，將應用程式的所有靜態檔案移至 settings.py 中 STATIC_ROOT 指定的資料夾：

python3 manage.py collectstatic

在 app.yaml 檔案所在的應用程式目錄中執行下列指令，即可上傳應用程式：

gcloud app deploy

等候更新完成通知訊息。

9. 測試前端用戶端

在網路瀏覽器中輸入 https://<您的專案 ID>.appspot.com。

這次您的要求是由在 App Engine 標準環境執行的網路伺服器提供。

app deploy 指令會依照 app.yaml 中的說明部署應用程式，並將新部署的版本設為預設版本，藉此提供所有新流量。

10. 正式環境

11. 準備好在實際工作環境提供內容後，請前往 mysite/settings.py，將 DEBUG 變數變更為 False。

12. 測試聊天機器人

前往 https://<your_project_id>.appspot.com 並輸入下列內容：

使用者：「設定明天下午 3 點的車輛登記預約。」
聊天機器人的回應如下：

Google 日曆會預訂回應。

13. 清除所用資源

如果您打算完成其他 Dialogflow 程式碼研究室，請暫時略過這部分，之後再返回查看。

刪除 Dialogflow 虛擬服務專員

按一下現有服務專員旁邊的。
在「General」分頁中，捲動至底部，然後按一下 [Delete this Agent]。
在隨即出現的視窗中輸入 Delete，然後按一下「Delete」(刪除)。

14. 恭喜

您已在 Dialogflow 中建立聊天機器人，並將其與 Google 日曆整合。你已成為聊天機器人開發人員！

瞭解詳情

詳情請參閱下列資源：

將 Vision API 與 Dialogflow 整合
Dialogflow GitHub 頁面中的程式碼範例