Tạo ứng dụng Django giao diện người dùng cho ứng dụng Dialogflow

1. Trước khi bắt đầu

Trong lớp học lập trình này, bạn sẽ tìm hiểu cách tạo ứng dụng Django giao diện người dùng để tạo trải nghiệm trò chuyện cho ứng dụng Dialogflow. Cụ thể, bạn sẽ làm như sau:

  • Tải xuống, thiết lập và chạy ứng dụng giao diện người dùng Django.
  • Thiết lập điểm cuối performIntent để gọi từ ứng dụng giao diện người dùng Django.
  • Triển khai ứng dụng lên Google Cloud trên App Engine.
  • Kiểm tra xem lời mời trên Lịch có đang được thiết lập theo yêu cầu của người dùng hay không.

Điều kiện tiên quyết

Trước khi tiếp tục, bạn cần hoàn tất các lớp học lập trình sau:

  1. Tạo trình lên lịch hẹn bằng Dialogflow
  2. Tìm hiểu về các thực thể trong Dialogflow
  3. Tìm hiểu về phương thức thực hiện bằng cách tích hợp Dialogflow với Lịch

Kiến thức bạn sẽ học được

  • Cách thiết lập và chạy ứng dụng giao diện người dùng Django cho Dialogflow
  • Cách triển khai ứng dụng giao diện người dùng Django cho Google Cloud trên App Engine
  • Cách thử nghiệm ứng dụng Dialogflow từ giao diện người dùng tuỳ chỉnh

Sản phẩm bạn sẽ tạo ra

  • Bạn sẽ thiết lập và chạy một ứng dụng giao diện người dùng Django cho Dialogflow.
  • Bạn sẽ triển khai ứng dụng giao diện người dùng Django cho Google Cloud trên App Engine.
  • Bạn sẽ thử nghiệm một ứng dụng Dialogflow từ giao diện người dùng tuỳ chỉnh đó.

Bạn cần có

  • Hiểu biết cơ bản về Python
  • Hiểu biết cơ bản về Dialogflow

2. Tổng quan về kiến trúc

Bạn sẽ sử dụng giao diện cuộc trò chuyện trên Trình lên lịch hẹn mà bạn đã tạo trước đây và tạo một giao diện người dùng tuỳ chỉnh cho ứng dụng. Bạn sẽ xây dựng giao diện người dùng bằng Django, chạy và kiểm thử cục bộ, đồng thời triển khai giao diện này cho App Engine.

Người dùng sẽ gửi một yêu cầu cuộc hẹn qua giao diện người dùng. Giao diện người dùng sẽ gọi API discoveryIntent để thiết lập một cuộc hẹn cho ngày và giờ được yêu cầu. Sau đó, công cụ thực hiện Dialogflow sẽ gửi yêu cầu đến Lịch để đặt cuộc hẹn tương ứng và gửi lại thông báo xác nhận cho người dùng thông qua Dialogflow.

84515171be610d4.png.

Kết quả cuối cùng sẽ có dạng như sau:

7146cd729c50f7c1.pngS

3. Tải xuống và chạy ứng dụng giao diện người dùng

  1. Sao chép kho lưu trữ vào máy cục bộ của bạn bằng cách nhập lệnh sau vào cửa sổ dòng lệnh cục bộ trên máy tính của bạn:
git clone https://github.com/priyankavergadia/Django-Dialogflow-Appointment-Scheduler.git
  1. Thay đổi sang thư mục chứa mã. Ngoài ra, bạn có thể tải mẫu xuống dưới dạng tệp zip và giải nén.
cd Django-Dialogflow-Appointment-Scheduler

4. Thiết lập môi trường cục bộ

Khi được triển khai, ứng dụng của bạn sẽ sử dụng Proxy Cloud SQL được tích hợp sẵn trong môi trường tiêu chuẩn của App Engine để giao tiếp với thực thể Cloud SQL. Tuy nhiên, để kiểm thử cục bộ ứng dụng, bạn phải cài đặt và sử dụng một bản sao cục bộ của Proxy Cloud SQL trong môi trường phát triển. Để biết thêm thông tin, hãy xem bài viết Giới thiệu về Cloud SQL Proxy.

Để thực hiện các thao tác quản trị cơ bản trên phiên bản Cloud SQL, bạn có thể sử dụng ứng dụng Cloud SQL cho MySQL.

Cài đặt Cloud SQL Proxy

Tải xuống và cài đặt Cloud SQL Proxy. Proxy Cloud SQL được dùng để kết nối với thực thể Cloud SQL khi chạy cục bộ.

Tải proxy xuống.

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

Làm cho proxy có thể thực thi.

chmod +x cloud_sql_proxy

Tạo một thực thể Cloud SQL

  1. Tạo một phiên bản Cloud SQL cho phiên bản thế hệ thứ hai của MySQL. Đặt tên cho thực thể là "polls-instance" (cuộc thăm dò ý kiến) hoặc nội dung tương tự. Có thể mất vài phút để phiên bản này sẵn sàng. Sau khi tạo xong, hoạt động đó sẽ xuất hiện trong danh sách thực thể.
  2. Sử dụng công cụ gcloud để chạy lệnh sau, trong đó [YOUR_INSTANCE_NAME] đại diện cho tên của thực thể. Ghi lại giá trị thể hiện dưới dạng tên kết nối thực thể cho bước tiếp theo, giá trị này sẽ xuất hiện ở định dạng [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME].
gcloud sql instances describe [YOUR_INSTANCE_NAME]

Ngoài ra, bạn có thể nhấp vào thực thể đó để xem Tên kết nối thực thể.

c11e94464bf4fcf8.png

Khởi chạy thực thể Cloud SQL

Khởi động Proxy Cloud SQL bằng cách sử dụng tên kết nối thực thể ở bước trước. Thay thế [YOUR_INSTANCE_CONNECTION_NAME] bằng giá trị mà bạn đã ghi lại ở bước trước. Thao tác này sẽ thiết lập kết nối từ máy tính cục bộ với thực thể máy ảo của bạn cho mục đích kiểm thử cục bộ. Tiếp tục chạy Proxy Cloud SQL trong khi bạn kiểm thử cục bộ ứng dụng.

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

Tiếp theo, hãy tạo một người dùng và cơ sở dữ liệu Cloud SQL mới.

  1. Tạo một cơ sở dữ liệu mới bằng Google Cloud Console cho phiên bản Cloud SQL có tên là polls-instance. Ví dụ: bạn có thể nhập "cuộc thăm dò ý kiến" làm tên. a3707ec9bc38d412.png
  2. Tạo một tài khoản người dùng mới bằng Cloud Console cho phiên bản Cloud SQL có tên là polls-instance. f4d098fca49cccff.png

Định cấu hình cài đặt cơ sở dữ liệu

  1. Mở mysite/settings.py để chỉnh sửa.
  2. Ở hai vị trí, hãy thay thế [YOUR-USERNAME] và [YOUR-PASSWORD] bằng tên người dùng và mật khẩu của cơ sở dữ liệu mà bạn đã tạo ở phần trước. Việc này giúp thiết lập kết nối với cơ sở dữ liệu để triển khai App Engine và kiểm thử cục bộ.
  3. Trong dòng có nội dung ‘HOST': ‘cloudsql/ [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME],' hãy thay thế [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME] bằng giá trị mà bạn đã ghi lại trong phần trước.
  4. Chạy lệnh sau và sao chép giá trị tên kết nối của thực thể đã xuất cho bước tiếp theo.
gcloud sql instances describe [YOUR_INSTANCE_NAME]
  1. Thay thế [YOUR-CONNECTION-NAME] bằng giá trị bạn đã ghi lại trong phần trước.
  2. Thay thế [YOUR-DATABASE] bằng tên mà bạn đã chọn ở phần trước.
# [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]
  1. Đóng và lưu settings.py.

5. Thiết lập tài khoản dịch vụ

  1. Trong bảng điều khiển của Dialogflow, hãy nhấp vào e8a0a7d752849e01.png. Trong thẻ General (Chung) bên cạnh Project ID (Mã dự án), hãy nhấp vào biểu tượng Google Clouda9c6ff6374afe489.png.
  2. Nhấp vào Trình đơn điều hướng ↗ > API và Dịch vụ > Thông tin đăng nhập.
  3. Nhấp vào Tạo thông tin xác thực > Tài khoản dịch vụ. 86f51af0e7886fdd.pngS
  4. Trong phần Thông tin chi tiết về tài khoản dịch vụ, hãy nhập "appointment-scheduler" làm Tên tài khoản dịch vụ, rồi nhấp vào Tạo.

845d25f3e07ff770.pngs

  1. Khi thấy dòng chữ Cấp quyền truy cập vào tài khoản dịch vụ này vào dự án, hãy nhấp vào Tiếp tục để bỏ qua.
  2. Nếu thấy Cấp cho người dùng quyền truy cập vào tài khoản dịch vụ này (không bắt buộc), hãy nhấp vào Tạo khoá > JSON > Tạo.

Một tệp JSON sẽ được tải xuống máy tính của bạn và bạn cần có tệp này trong các phần thiết lập sau đây.

a424cec60144d707.png

6. Thiết lập điểm cuối performIntent để gọi từ ứng dụng

  1. Trong thư mục trò chuyện, hãy thay thế AppointmentScheduler.json bằng tệp JSON chứa thông tin đăng nhập.
  2. Trong views.py của thư mục trò chuyện, hãy thay đổi GOOGLE_PROJECT_ID = "<YOUR_PROJECT_ID>" thành mã dự án.

7. Tạo và chạy ứng dụng trên máy

Để chạy ứng dụng Django trên máy tính cục bộ, bạn cần thiết lập một môi trường phát triển Python, bao gồm Python, pip và virtualenv. Để biết hướng dẫn, hãy xem Thiết lập môi trường phát triển Python.

  1. Tạo một môi trường Python tách biệt và cài đặt các phần phụ thuộc:
virtualenv env
source env/bin/activate
pip install -r requirements.txt
  1. Chạy quá trình di chuyển Django để thiết lập các mô hình của bạn.
python3 manage.py makemigrations
python3 manage.py makemigrations polls
python3 manage.py migrate
  1. Khởi động một máy chủ web cục bộ.
python3 manage.py runserver
  1. Trong trình duyệt web, hãy nhập http://localhost:8000/. Bạn sẽ thấy một trang web đơn giản như trong ảnh chụp màn hình sau đây:

d40910969aa71020.png

Các trang ứng dụng mẫu được phân phối bởi máy chủ web Django đang chạy trên máy tính của bạn. Khi bạn đã sẵn sàng tiếp tục, nhấn Control+S (Command+S trên Macintosh) để dừng máy chủ web cục bộ.

8. Triển khai ứng dụng trong môi trường tiêu chuẩn của App Engine

Chạy lệnh sau để di chuyển tất cả tệp tĩnh của ứng dụng vào thư mục do STATIC_ROOT chỉ định trong settings.py:

python3 manage.py collectstatic

Tải ứng dụng lên bằng cách chạy lệnh sau trong thư mục ứng dụng chứa tệp app.yaml:

gcloud app deploy

Chờ thông báo cho bạn biết rằng quá trình cập nhật đã hoàn tất.

9. Kiểm thử ứng dụng giao diện người dùng

Trong trình duyệt web, hãy nhập https://<your_project_id>.appspot.com.

Lần này, yêu cầu của bạn được một máy chủ web chạy trong môi trường tiêu chuẩn của App Engine phân phát.

Lệnh app deploy triển khai ứng dụng như mô tả trong app.yaml và đặt phiên bản mới triển khai làm phiên bản mặc định, khiến phiên bản này phân phát tất cả lưu lượng truy cập mới.

10. Sản xuất

11. Khi bạn sẵn sàng cung cấp nội dung trong phiên bản chính thức, hãy thay đổi biến DEBUG thành False trong mysite/settings.py.

12. Kiểm thử bot trò chuyện

Chuyển đến https://<your_project_id>.appspot.com rồi nhập thông tin sau:

  1. Người dùng: "Đặt lịch hẹn đăng ký xe lúc 3 giờ chiều mai".
  2. Bot trò chuyện phản hồi như sau:

3b0abfec8f4ba279.pngS

  1. Lịch đặt câu trả lời.

eb49089765b84fc6.png

13. Dọn dẹp

Nếu bạn dự định hoàn thành các lớp học lập trình khác về Dialogflow, hãy tạm thời bỏ qua phần này và quay lại sau.

Xoá nhân viên hỗ trợ dự án Dialogflow

  1. Nhấp vào biểu tượng e8a0a7d752849e01.png bên cạnh nhân viên hỗ trợ hiện có.
  2. 520c1c6bb9f46ea6.pngS
  3. Trong thẻ General (Chung), hãy di chuyển xuống dưới cùng rồi nhấp vào Delete This Agent (Xoá nhân viên hỗ trợ này).
  4. Nhập Delete vào cửa sổ xuất hiện và nhấp vào Delete.

14. Xin chúc mừng

Bạn đã tạo một bot trò chuyện trong Dialogflow và tích hợp bot này với Lịch. Giờ bạn đã là nhà phát triển chatbot!

Tìm hiểu thêm

Hãy xem các tài nguyên sau để tìm hiểu thêm: