Vision API را با Dialogflow ادغام کنید

۱. قبل از شروع

در این آزمایشگاه کد، شما رابط برنامه‌نویسی کاربردی (API) ویژن (Vision API) را با دیالوگ‌فلو (Dialogflow) ادغام خواهید کرد تا پاسخ‌های غنی و پویای مبتنی بر یادگیری ماشین را به ورودی‌های تصویر ارائه شده توسط کاربر ارائه دهید. شما یک برنامه چت‌بات ایجاد خواهید کرد که یک تصویر را به عنوان ورودی دریافت می‌کند، آن را در رابط برنامه‌نویسی کاربردی ویژن پردازش می‌کند و یک مکان مشخص شده را به کاربر برمی‌گرداند. به عنوان مثال، اگر کاربر تصویری از تاج محل آپلود کند، چت‌بات تاج محل را به عنوان پاسخ برمی‌گرداند.

این مفید است زیرا می‌توانید اقلام موجود در تصویر را تجزیه و تحلیل کرده و بر اساس اطلاعات به دست آمده اقدام کنید. همچنین می‌توانید یک سیستم پردازش بازپرداخت ایجاد کنید تا به کاربران کمک کند رسیدها را بارگذاری کنند، تاریخ خرید را در رسید استخراج کنند و در صورت مناسب بودن تاریخ، بازپرداخت را پردازش کنند.

به نمونه دیالوگ زیر نگاهی بیندازید:

کاربر: سلام

چت‌بات: سلام! شما می‌توانید برای کاوش در مکان‌های دیدنی، عکس آپلود کنید.

کاربر: تصویری که تاج محل در آن باشد را بارگذاری کنید.

چت‌بات: فایل در حال پردازش است، نتایج به شرح زیر است: تاج محل، باغ تاج محل، تاج محل.

15a4243e453415ca.png

پیش‌نیازها

قبل از ادامه، باید codelab های زیر را تکمیل کنید:

  1. ساخت برنامه زمانبندی قرار ملاقات با Dialogflow
  2. یک ربات چت Dialogflow را با Actions on Google ادغام کنید
  3. آشنایی با موجودیت‌ها در Dialogflow
  4. یک کلاینت جنگو با رابط کاربری frontend برای یک برنامه Dialogflow بسازید.

شما همچنین باید مفاهیم و ساختارهای اساسی Dialogflow را درک کنید، که می‌توانید از ویدیوهای زیر در مسیر ساخت چت‌بات با Dialogflow آنها را فرا بگیرید:

آنچه یاد خواهید گرفت

  • نحوه ایجاد یک عامل Dialogflow
  • نحوه به‌روزرسانی عامل Dialogflow برای آپلود فایل‌ها
  • نحوه تنظیم اتصال Vision API با تکمیل Dialogflow
  • نحوه تنظیم و اجرای یک برنامه frontend جنگو برای Dialogflow
  • نحوه استقرار برنامه frontend جنگو در Google Cloud در App Engine
  • نحوه تست برنامه Dialogflow از یک رابط کاربری سفارشی

آنچه خواهید ساخت

  • یک عامل Dialogflow ایجاد کنید
  • پیاده‌سازی یک رابط کاربری Django برای آپلود فایل
  • پیاده‌سازی Dialogflow برای فراخوانی Vision API در برابر تصویر آپلود شده

آنچه نیاز دارید

  • دانش پایه از پایتون
  • درک اولیه از Dialogflow
  • درک اولیه از Vision API

۲. مرور کلی معماری

شما یک تجربه مکالمه جدید با یک رابط کاربری سفارشی Django ایجاد خواهید کرد و آن را برای ادغام با Vision API گسترش خواهید داد. شما رابط کاربری را با چارچوب Django خواهید ساخت، آن را به صورت محلی اجرا و آزمایش خواهید کرد و سپس آن را در App Engine مستقر خواهید کرد. رابط کاربری به این شکل خواهد بود:

5b07e09dc4b84646.png

جریان درخواست به این صورت عمل خواهد کرد که در تصویر زیر نشان داده شده است:

  1. کاربر از طریق frontend درخواستی ارسال می‌کند.
  2. این باعث می‌شود که یک فراخوانی به Dialogflow detectIntent API انجام شود تا گفتار کاربر را به نیت درست نگاشت کند.
  3. پس از شناسایی هدف کاوش، Dialogflow درخواستی را به Vision API ارسال می‌کند، پاسخی دریافت می‌کند و آن را برای کاربر ارسال می‌کند.

۱۵۳۷۲۵eb50e008d4.png

در اینجا معماری کلی به چه شکل خواهد بود.

a2fcea32222a9cb4.png

۳. رابط برنامه‌نویسی کاربردی ویژن چیست؟

رابط برنامه‌نویسی کاربردی بینایی (Vision API) یک مدل یادگیری ماشین از پیش آموزش‌دیده است که از تصاویر، بینش‌هایی را استخراج می‌کند. این رابط می‌تواند بینش‌های متعددی از جمله برچسب‌گذاری تصویر، تشخیص چهره و نقاط دیدنی، تشخیص کاراکتر نوری و برچسب‌گذاری محتوای صریح را در اختیار شما قرار دهد. برای کسب اطلاعات بیشتر، به هوش مصنوعی بینایی (Vision AI) مراجعه کنید.

۴. یک عامل Dialogflow ایجاد کنید

  1. به کنسول Dialogflow بروید.
  2. وارد شوید. (اگر اولین بار است که از این سرویس استفاده می‌کنید، از ایمیل خود برای ثبت نام استفاده کنید.)
  3. شرایط و ضوابط را بپذیرید، و شما در کنسول خواهید بود.
  4. کلیک d9e90c93f779808.png ، به پایین بروید و روی ایجاد عامل جدید کلیک کنید. 3b3f9677e2a26d93.png
  5. به عنوان نام عامل، "VisionAPI" را وارد کنید.
  6. روی ایجاد کلیک کنید.

Dialogflow دو هدف پیش‌فرض زیر را به عنوان بخشی از عامل ایجاد می‌کند:

  1. قصد خوشامدگویی پیش‌فرض به کاربران شما خوشامد می‌گوید.
  2. هدف پیش‌فرضِ جایگزین، تمام سوالاتی را که ربات شما نمی‌فهمد، دریافت می‌کند.

در این مرحله، شما یک ربات کاربردی دارید که به کاربران خوشامد می‌گوید، اما باید آن را به‌روزرسانی کنید تا به کاربران اطلاع دهید که می‌توانند تصویری را برای کاوش در مکان‌های دیدنی آپلود کنند.

به‌روزرسانی پیش‌فرض خوش‌آمدگویی برای اطلاع‌رسانی به کاربر جهت آپلود تصویر

  1. روی «قصد خوشامدگویی پیش‌فرض» کلیک کنید.
  2. به پاسخ‌ها > پیش‌فرض > پاسخ متنی یا SSML بروید و عبارت «سلام! می‌توانید برای کاوش در مکان‌های دیدنی، تصویری آپلود کنید» را وارد کنید.

f9cd9ba6917a7aa9.png

ایجاد موجودیت

  1. روی موجودیت‌ها کلیک کنید.

432fff294b666c93.png

  1. روی «ایجاد نهاد» کلیک کنید، نام آن را «نام فایل» بگذارید و روی «ذخیره» کلیک کنید.

602d001d684485de.png

ایجاد هدف جدید

  1. روی Intents > Create Intent کلیک کنید.
  2. به عنوان نام Intent، عبارت «Explore uploaded image» را وارد کنید.
  3. روی عبارات آموزشی > افزودن عبارات آموزشی کلیک کنید و عبارات «file is demo.jpg » و «file is taj.jpeg » را به عنوان عبارات کاربری با شناسه @filename به عنوان موجودیت وارد کنید.

dd54ebda59c6b896.png

  1. روی پاسخ‌ها > افزودن پاسخ > پیش‌فرض > پاسخ متنی یا SSML کلیک کنید. عبارت «در حال ارزیابی فایل» را وارد کنید و روی افزودن پاسخ‌ها کلیک کنید.
  2. روی Fulfillment > Enable completion کلیک کنید و Enable webhook call for this intent را فعال کنید.

b32b7ac054fcc938.png

۵. تنظیم فرآیند تکمیل سفارش برای ادغام با Vision API

  1. روی تکمیل سفارش کلیک کنید.
  2. ویرایشگر درون‌خطی را فعال کنید.

c8574c6ef899393f.png

  1. فایل index.js با کد زیر به‌روزرسانی کنید و YOUR-BUCKET-NAME با نام مخزن ذخیره‌سازی ابری خود به‌روزرسانی کنید.
'use strict';

const functions = require('firebase-functions');
const {google} = require('googleapis');
const {WebhookClient} = require('dialogflow-fulfillment');
const vision = require('@google-cloud/vision');
  /**
   * TODO(developer): Uncomment the following lines before running the sample.
   */
const bucketName = 'YOUR-BUCKET-NAME';
const timeZone = 'America/Los_Angeles';
const timeZoneOffset = '-07:00';

exports.dialogflowFirebaseFulfillment = functions.https.onRequest((request, response) => {
  const agent = new WebhookClient({ request, response });
  console.log("Parameters", agent.parameters);

  function applyML(agent){
    const filename = agent.parameters.filename;
    console.log("filename is: ", filename);

    // call vision API to detect text
    return callVisionApi(agent, bucketName, filename).then(result => {
                      console.log(`result is ${result}`);
                      agent.add(`file is being processed, here are the results:  ${result}`);
            //agent.add(`file is being processed ${result}`);
        }).catch((error)=> {
            agent.add(`error occurred at apply ml function`  + error);
        });
  }

  let intentMap = new Map();
  intentMap.set('Explore uploaded image', applyML);
  agent.handleRequest(intentMap);
});


async function callVisionApi(agent, bucketName, fileName){
    // [START vision_text_detection_gcs]
  // Imports the Google Cloud client libraries
  // Creates a client
  
  const client = new vision.ImageAnnotatorClient();
    try {
        // Performs text detection on the gcs file
        const [result] = await client.landmarkDetection(`gs://${bucketName}/${fileName}`);
        const detections = result.landmarkAnnotations;
        var detected = [];
        detections.forEach(text => {
            console.log(text.description);
            detected.push(text.description);
        });
        return detected;
    }
    catch(error) {
        console.log('fetch failed', error);
        return [];
    }
}
  1. برای جایگزینی محتویات، کد زیر را در package.json قرار دهید.
{
  "name": "dialogflowFirebaseFulfillment",
  "description": "Dialogflow fulfillment for the bike shop sample",
  "version": "0.0.1",
  "private": true,
  "license": "Apache Version 2.0",
  "author": "Google Inc.",
  "engines": {
    "node": "6"
  },
  "scripts": {
    "lint": "semistandard --fix \"**/*.js\"",
    "start": "firebase deploy --only functions",
    "deploy": "firebase deploy --only functions"
  },
  "dependencies": {
    "firebase-functions": "2.0.2",
    "firebase-admin": "^5.13.1",
    "actions-on-google": "2.2.0", 
    "googleapis": "^27.0.0",
    "dialogflow-fulfillment": "^0.6.1",
    "@google-cloud/bigquery": "^1.3.0",
    "@google-cloud/storage": "^2.0.0",
    "@google-cloud/vision": "^0.25.0"
  }
}
  1. روی ذخیره کلیک کنید.

۶. برنامه frontend را دانلود و اجرا کنید

  1. این مخزن را روی دستگاه محلی خود کلون کنید:
https://github.com/priyankavergadia/visionapi-dialogflow.git
  1. به پوشه‌ای که کد در آن قرار دارد بروید. همچنین می‌توانید نمونه را به صورت زیپ دانلود کرده و آن را استخراج کنید.
cd visionapi-dialogflow

۷. محیط محلی خود را تنظیم کنید

هنگام استقرار، برنامه شما از Cloud SQL Proxy که در محیط استاندارد App Engine تعبیه شده است برای ارتباط با نمونه Cloud SQL شما استفاده می‌کند. با این حال، برای آزمایش برنامه خود به صورت محلی، باید یک کپی محلی از Cloud SQL Proxy را در محیط توسعه خود نصب و استفاده کنید. برای کسب اطلاعات بیشتر، به بخش «درباره Cloud SQL Proxy» مراجعه کنید.

برای انجام وظایف مدیریتی اولیه در نمونه Cloud SQL خود، می‌توانید از Cloud SQL برای کلاینت MySQL استفاده کنید.

پروکسی Cloud SQL را نصب کنید

با دستور زیر، Cloud SQL Proxy را دانلود و نصب کنید. Cloud SQL Proxy برای اتصال به نمونه Cloud SQL شما هنگام اجرای محلی استفاده می‌شود.

دانلود پروکسی:

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

پروکسی را قابل اجرا کنید.

chmod +x cloud_sql_proxy

یک نمونه SQL ابری ایجاد کنید

  1. یک نمونه Cloud SQL برای MySQL Second Generation ایجاد کنید. عبارت "polls-instance" یا چیزی شبیه به آن را به عنوان نام وارد کنید. آماده شدن نمونه ممکن است چند دقیقه طول بکشد. پس از آماده شدن، باید در لیست نمونه‌ها قابل مشاهده باشد.
  2. اکنون از ابزار خط فرمان gcloud برای اجرای دستور زیر استفاده کنید که در آن [YOUR_INSTANCE_NAME] نام نمونه Cloud SQL شما را نشان می‌دهد. مقداری که برای connectionName نشان داده شده است را برای مرحله بعدی یادداشت کنید. این مقدار در قالب [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME] نمایش داده می‌شود.
gcloud sql instances describe [YOUR_INSTANCE_NAME]

روش دیگر این است که می‌توانید روی نمونه در کنسول کلیک کنید تا نام اتصال نمونه را دریافت کنید.

c11e94464bf4fcf8.png

نمونه Cloud SQL خود را مقداردهی اولیه کنید

پروکسی Cloud SQL را با استفاده از connectionName از بخش قبل شروع کنید.

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

به جای [YOUR_INSTANCE_CONNECTION_NAME] مقداری را که در بخش قبل ثبت کرده‌اید، قرار دهید. این کار باعث ایجاد اتصال از رایانه محلی شما به نمونه Cloud SQL شما برای اهداف آزمایش محلی می‌شود. Cloud SQL Proxy را در تمام مدتی که برنامه خود را به صورت محلی آزمایش می‌کنید، در حال اجرا نگه دارید.

در مرحله بعد، یک کاربر و پایگاه داده جدید Cloud SQL ایجاد کنید.

  1. با استفاده از کنسول گوگل کلود، یک پایگاه داده جدید برای نمونه ابری SQL خود با نام polls-instance ایجاد کنید. برای مثال، می‌توانید "polls" را به عنوان نام وارد کنید. a3707ec9bc38d412.png
  2. با استفاده از کنسول ابری، یک کاربر جدید برای نمونه‌ی SQL ابری خود با نام polls-instance ایجاد کنید. f4d098fca49cccff.png

تنظیمات پایگاه داده را پیکربندی کنید

  1. برای ویرایش، mysite/settings-changeme.py را باز کنید.
  2. نام فایل را به setting.py تغییر دهید.
  3. در دو جا، [YOUR-USERNAME] و [YOUR-PASSWORD] را با نام کاربری و رمز عبور پایگاه داده که در بخش قبل ایجاد کرده‌اید، جایگزین کنید. این به تنظیم اتصال به پایگاه داده برای استقرار App Engine و آزمایش محلی کمک می‌کند.
  4. در خط 'HOST': 'cloudsql/ [PROJECT_NAME]:[REGION_NAME]:[INSTANC E_NAME]' عبارت [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME] را با نام نمونه‌ای که در بخش قبل دریافت کرده‌اید، جایگزین کنید.
  5. دستور زیر را اجرا کنید و مقدار connectionName خروجی را برای مرحله بعدی کپی کنید.
gcloud sql instances describe [YOUR_INSTANCE_NAME]
  1. به جای [YOUR-CONNECTION-NAME] مقداری که در مرحله قبل ثبت کردید را قرار دهید.
  2. به جای [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]
  1. settings.py ببندید و ذخیره کنید.

۸. تنظیم حساب کاربری سرویس

  1. در کنسول Dialogflow، کلیک کنید ۲۱a۲۱c۱۱۰۴f۵fdf۳.png در برگه عمومی ، به Google Project > Project ID بروید و روی Google Cloud کلیک کنید. 7b2236f5627c37a0.png برای باز کردن کنسول ابری. a4cfb880b3c8e789.png
  2. روی منوی ناوبری ☰ > مدیریت و حساب‌های کاربری > حساب‌های کاربری سرویس کلیک کنید، سپس روی 796e7c9e65ae751f.png در کنار ادغام‌های Dialogflow کلیک کنید و روی کلید Create کلیک کنید.

3d72abc0c184d281.png

  1. یک فایل JSON در رایانه شما دانلود خواهد شد که در بخش‌های بعدی تنظیمات به آن نیاز خواهید داشت.

۹. نقطه پایانی Dialogflow detectIntent را طوری تنظیم کنید که از برنامه فراخوانی شود

  1. در پوشه چت، key-sample.json را با فایل JSON مربوط به اعتبارنامه‌های خود جایگزین کنید و نام آن را key.json بگذارید.
  2. در فایل views.py در پوشه چت، عبارت GOOGLE_PROJECT_ID = "<YOUR_PROJECT_ID>" را به شناسه پروژه خود تغییر دهید.

۱۰. ایجاد سطل‌های ذخیره‌سازی ابری

یک سطل ذخیره‌سازی ابری برای اشیاء استاتیک frontend ایجاد کنید

  1. در کنسول ابری، روی منوی پیمایش ☰ > ذخیره‌سازی کلیک کنید.

87ff9469db4eb77f.png

  1. روی ایجاد سطل کلیک کنید.
  2. یک نام منحصر به فرد جهانی ارائه دهید.

a15a6612e92a39d3.png

  1. محل ذخیره داده‌های خود را انتخاب کنید. منطقه را انتخاب کنید و مکانی را که به بهترین وجه با نیازهای شما مطابقت دارد، انتخاب کنید.
  2. کلاس ذخیره‌سازی پیش‌فرض خود را Standard انتخاب کنید.

9c56abe632cf61db.png

  1. گزینه «تنظیم مجوزها به صورت یکنواخت در سطح سطل (فقط خط‌مشی سطل)» را انتخاب کنید، سپس برای ایجاد سطل، روی «ادامه» کلیک کنید.

f175ac794049df04.png

  1. پس از ایجاد سطل، روی منوی ناوبری ☰ > ذخیره‌سازی > مرورگر کلیک کنید و سطلی را که ایجاد کرده‌اید پیدا کنید.

9500ee19b427158c.png

  1. کلیک 796e7c9e65ae751f.png در کنار سطل مربوطه کلیک کنید و روی ویرایش مجوزهای سطل کلیک کنید.

fd0a310bc3656edd.png

  1. روی افزودن اعضا کلیک کنید، روی اعضای جدید کلیک کنید، "allUsers" را وارد کنید، سپس روی انتخاب یک نقش > نمایشگر شیء ذخیره‌سازی کلیک کنید. این کار دسترسی مشاهده فایل‌های استاتیک frontend را برای allUsers فراهم می‌کند. این یک تنظیم امنیتی ایده‌آل برای فایل‌ها نیست، اما برای هدف این codelab خاص کار می‌کند.

7519116abd56d5a3.png

ایجاد یک فضای ذخیره‌سازی ابری برای تصاویر آپلود شده توسط کاربر

برای ایجاد یک سطل جداگانه برای آپلود تصاویر کاربر، همان دستورالعمل‌ها را دنبال کنید. دوباره مجوزها را روی "allUsers" تنظیم کنید، اما Storage Object Creator و Storage Object Viewer را به عنوان نقش‌ها انتخاب کنید.

۱۱. پیکربندی مخازن ذخیره‌سازی ابری در برنامه‌ی فرانت‌اند

پیکربندی مخزن ذخیره‌سازی ابری در settings.py

  1. mysite/setting.py را باز کنید.
  2. متغیر GCS_BUCKET پیدا کنید و '<YOUR-GCS-BUCKET-NA ME>' را با سطل استاتیک Cloud Storage خود جایگزین کنید.
  3. متغیر GS_MEDIA_BUCKET_NAME را پیدا کنید و '<YOUR-GCS-BUCKET-NAME-MED IA>' را با نام مخزن ذخیره‌سازی ابری خود برای تصاویر جایگزین کنید.
  4. متغیر GS_STATIC_BUCKET_NAME را پیدا کنید و '<YOUR-GCS-BUCKET-NAME-STAT IC>' را با نام باکت ذخیره‌سازی ابری خود برای فایل‌های استاتیک جایگزین کنید.
  5. فایل را ذخیره کنید.
GCS_BUCKET = '<YOUR-GCS-BUCKET-NAME>'
GS_MEDIA_BUCKET_NAME = '<YOUR-GCS-BUCKET-NAME-MEDIA>'
GS_STATIC_BUCKET_NAME = '<YOUR-GCS-BUCKET-NAME-STATIC>'

پیکربندی فضای ذخیره‌سازی ابری در فایل home.html

  • پوشه چت را باز کنید، سپس templates را باز کنید و نام home-changeme.html را به home.html تغییر دهید.
  • به دنبال <YOUR-GCS-BUCKET-NAME-MEDIA> بگردید و آن را با نام باکت خود که می‌خواهید فایل آپلود شده توسط کاربر در آن ذخیره شود، جایگزین کنید. این کار مانع از ذخیره فایل آپلود شده توسط کاربر در frontend و نگه داشتن فایل‌های استاتیک در باکت Cloud Storage می‌شود. Vision API باکت Cloud Storage را فراخوانی می‌کند تا فایل را دریافت کرده و پیش‌بینی را انجام دهد.

۱۲. ساخت و اجرای برنامه به صورت محلی

برای اجرای برنامه Django روی رایانه محلی خود، باید یک محیط توسعه پایتون، شامل پایتون، pip و virtualenv، راه‌اندازی کنید. برای دستورالعمل‌ها، به «راه‌اندازی محیط توسعه پایتون» مراجعه کنید.

  1. یک محیط پایتون ایزوله ایجاد کنید و وابستگی‌ها را نصب کنید.
virtualenv env
source env/bin/activate
pip install -r requirements.txt
  1. برای تنظیم مدل‌های خود، migrationهای جنگو را اجرا کنید.
python3 manage.py makemigrations
python3 manage.py makemigrations polls
python3 manage.py migrate
  1. یک وب سرور محلی راه اندازی کنید.
python3 manage.py runserver
  1. در مرورگر وب خود، به آدرس http://localhost:8000/ بروید. باید یک صفحه وب ساده مانند این را ببینید:.

8f986b8981f80f7b.png

صفحات برنامه نمونه توسط وب سرور Django که روی رایانه شما اجرا می‌شود، ارائه می‌شوند. وقتی آماده ادامه کار شدید، Control+C (در مکینتاش Command+C ) را فشار دهید تا وب سرور محلی متوقف شود.

از کنسول مدیریت جنگو استفاده کنید

  1. یک کاربر ارشد (superuser) ایجاد کنید.
python3 manage.py createsuperuser
  1. یک وب سرور محلی راه اندازی کنید.
python3 manage.py runserver
  1. در مرورگر وب خود به آدرس http://localhost:8000/admin/ بروید. برای ورود به سایت مدیریت، نام کاربری و رمز عبوری را که هنگام اجرای createsuperuser ایجاد کرده‌اید، وارد کنید.

۱۳. برنامه را در محیط استاندارد App Engine مستقر کنید

با اجرای دستور زیر، تمام محتوای استاتیک برنامه را در یک پوشه جمع‌آوری کنید، که تمام فایل‌های استاتیک برنامه را به پوشه‌ای که توسط STATIC_ROOT در settings.py مشخص شده است، منتقل می‌کند:

python3 manage.py collectstatic

با اجرای دستور زیر از دایرکتوری برنامه که فایل app.yaml در آن قرار دارد، برنامه را آپلود کنید:

gcloud app deploy

منتظر پیامی باشید که به شما اطلاع می‌دهد به‌روزرسانی تکمیل شده است.

۱۴. اپلیکیشن frontend را تست کنید

در مرورگر وب خود، به آدرس https://<your_project_id>.appspot.com بروید.

این بار، درخواست شما توسط یک وب سرور که در محیط استاندارد App Engine اجرا می‌شود، ارائه می‌شود.

دستور app deploy برنامه را همانطور که در app.yaml توضیح داده شده است، مستقر می‌کند و نسخه تازه مستقر شده را به عنوان نسخه پیش‌فرض تنظیم می‌کند و باعث می‌شود که به تمام ترافیک جدید سرویس دهد.

۱۵. تولید

وقتی آماده ارائه محتوای خود در محیط تولید شدید، متغیر DEBUG را در mysite/settings.py به False تغییر دهید.

۱۶. چت‌بات خود را آزمایش کنید

می‌توانید چت‌بات خود را در شبیه‌ساز آزمایش کنید، یا از وب یا یکپارچه‌سازی گوگل هوم که قبلاً ساخته‌اید استفاده کنید.

  1. کاربر: "سلام"
  2. چت‌بات: «سلام! شما می‌توانید برای کشف مکان‌های دیدنی، عکس آپلود کنید.»
  3. کاربر تصویری را آپلود می‌کند.

این تصویر را دانلود کنید، نام آن را demo.jpg بگذارید و از آن استفاده کنید.

c3aff843c9f132e4.jpeg

  1. چت‌بات: «فایل در حال پردازش است، نتایج به شرح زیر است: پل گلدن گیت، منطقه تفریحی ملی گلدن گیت، پل گلدن گیت، پل گلدن گیت، پل گلدن گیت.»

در کل، باید به این شکل باشد:

۲۲۸df9993bfc001d.png

۱۷. تمیز کردن

اگر می‌خواهید سایر کدهای Dialogflow را تکمیل کنید، از این بخش صرف نظر کنید و بعداً به آن برگردید.

عامل Dialogflow را حذف کنید

  1. کلیک ca4337eeb5565bcb.png در کنار نماینده فعلی شما.

520c1c6bb9f46ea6.png

  1. در برگه عمومی ، به پایین بروید و روی حذف این عامل کلیک کنید.
  2. در پنجره‌ای که ظاهر می‌شود، عبارت Delete را تایپ کرده و روی Delete کلیک کنید.

۱۸. تبریک

شما یک چت‌بات در Dialogflow ایجاد کردید و آن را با Vision API ادغام کردید. اکنون شما یک توسعه‌دهنده چت‌بات هستید!

بیشتر بدانید

برای کسب اطلاعات بیشتر، نمونه‌های کد را در صفحه گیت‌هاب Dialogflow بررسی کنید.