Разработка навыка Алисы и сайта с авторизацией

1. Установите подсистему Windows Subsystem for Linux (WSL) для использования Linux.
2. Запустите WSL (по умолчанию — Ubuntu).
3. Настройте окружение так, как описано в инструкции для операционной системы Linux.

1. В консоли управления Yandex Cloud выберите каталог, в котором будете выполнять операции.
2. На странице каталога нажмите Создать ресурс и выберите Бакет.
3. В поле Имя укажите имя бакета в соответствии с правилами именования.
4. В полях Доступ на чтение объектов, Доступ к списку объектов и Доступ на чтение настроек выберите Ограниченный.
5. Укажите максимальный размер бакета в ГБ.
6. Нажмите Создать бакет.

1. В консоли управления выберите каталог, в котором вы выполняете руководство.
2. В списке сервисов выберите API Gateway.
3. Нажмите Создать API-шлюз.
4. В поле Имя введите gate-1.
5. Нажмите Создать.
6. Дождитесь, когда статус API-шлюза изменится на Active.
7. Выберите созданный API-шлюз.
8. Найдите поля Идентификатор и Служебный домен и сохраните их значения. Они понадобятся при настройке навыка.

1. В консоли управления выберите каталог, в котором создали бакет.

2. Выберите сервис Managed Service for YDB.

3. Нажмите Создать базу данных.

4. Введите Имя базы. Требования к имени:

   • длина — от 2 до 63 символов;
   • может содержать строчные буквы латинского алфавита, цифры и дефисы;
   • первый символ — буква, последний — не дефис.

5. В блоке Тип базы данных выберите Serverless.

6. Нажмите Создать базу данных.

7. Дождитесь, когда статус базы данных изменится на Running.

8. Выберите созданную БД.

9. В блоке Соединение найдите поле Эндпоинт и сохраните его значение. Оно понадобится при создании функций.

1. Перейдите на сайт сервиса и авторизуйтесь.

2. Нажмите Создать приложение.

3. Выберите подходящее имя приложения и загрузите иконку.

4. В разделе Для каких платформ нужно приложение выберите Веб-сервисы и нажмите Сохранить и продолжить.

5. В разделе Платформы приложения в поле Redirect URI укажите следующие URL:

   • https://social.yandex.net/broker/redirect;
   • <служебный_домен_API-шлюза>/receive-token.

   Поле Suggest Hostname оставьте пустым.

6. Нажмите Сохранить и продолжить.

7. В разделе Доступ к данным выберите Доступ к портрету пользователя и нажмите Сохранить и продолжить.

8. В разделе Почта для связи укажите адрес своей почты и нажмите Сохранить и продолжить.

9. Проверьте данные и нажмите Всё верно, создать приложение.

Подробнее о возможностях сервиса Яндекс.OAuth читайте в документации.

1. Чтобы создать файл из шаблона secure-config-template.json, в папке с файлами проекта yc-serverless-alice-shareable-todolist выполните команду:

   cp secure-config-template.json secure-config.json
   

2. Откройте файл secure-config.json с помощью редактора nano:

   nano secure-config.json
   

3. Подставьте в файл значения переменных:

   • oauth_secret — пароль приложения (Client secret), зарегистрированного в Яндекс OAuth.
   • hash — случайная строка длиной 64 байта, закодированная с помощью base64, например qrJagO5NVwOj0FeTmgYSwUN+XXkiQJMWifvrklF53wT55q80Xk8vmEB3kxhtpDnA1WDC893Z9Bh6QcqK********. Сгенерировать случайное значение можно в терминале с помощью команды openssl rand -base64 64 | tr -d '\n'.
   • block — случайная строка длиной 32 байта, закодированная с помощью base64, например uwk0duFgn2nYyfu2VzJe+MnWKWQrfKaiZijI********. Сгенерировать случайное значение можно в терминале с помощью команды openssl rand -base64 32 | tr -d '\n'.

   Сгенерировать случайные значения можно с помощью сайта generate.plus.

1. Чтобы создать файл из шаблона variables-template.json, в папке с файлами проекта выполните команду:

   cp variables-template.json variables.json
   

2. Откройте файл variables.json с помощью редактора nano:

   nano variables.json
   

3. Подставьте в файл значения переменных:

   • folder-id — идентификатор каталога в облаке.
   • domain — служебный домен API-шлюза gate-1 без https://. Например d5dbo25bol8n********.apigw.yandexcloud.net.
   • oauth-client-id — значение поля ClientID приложения, зарегистрированного в Яндекс.OAuth.
   • database — размещение базы данных: вторая часть сохраненного ранее значения поля Эндпоинт (часть после вхождения /?database=). Например, /kz1/r1gra875baom********/g5n22e7ejfr1********.
   • database-endpoint — первая часть сохраненного ранее значения поля Эндпоинт (часть после вхождения grpcs:// и до вхождения /?database=). Например, ydb.serverless.yandexcloud.net:2135.
   • yc-profile — название профиля Yandex Cloud CLI.
   • secure-config-path — путь к файлу секретов secure-config.json.
   • storage-bucket — имя созданного бакета для хранения статических данных.
   • gateway-id — идентификатор API-шлюза gate-1.

Terraform позволяет быстро создать облачную инфраструктуру в Yandex Cloud и управлять ею с помощью файлов конфигураций. В файлах конфигураций хранится описание инфраструктуры на языке HCL (HashiCorp Configuration Language). При изменении файлов конфигураций Terraform автоматически определяет, какая часть вашей конфигурации уже развернута, что следует добавить или удалить.

Terraform распространяется под лицензией Business Source License, а провайдер Yandex Cloud для Terraform — под лицензией MPL-2.0.

Подробную информацию о ресурсах провайдера смотрите в документации на сайте Terraform или в зеркале.

Если у вас еще нет Terraform, установите его и настройте провайдер Yandex Cloud.

1. В папке с конфигурационным файлом app.tf выполните команду:

   terraform init
   

   Примечание

   В случае ошибки инициализации провайдера Terraform вида permission denied выполните команду sudo chown $(whoami) ~/yc-serverless-alice-shareable-todolist для изменения прав доступа текущего пользователя к папке проекта.

2. После успешной инициализации создайте ресурсы, передав значение OAuth-токена для авторизации в Yandex Cloud:

   terraform apply -var-file ./variables.json -var yc-token=<OAuth-токен>
   

   Terraform автоматически создаст или обновит требуемые ресурсы.

1. Перед компиляцией статических файлов убедитесь, что у вас установлен Node.js и пакетный менеджер npm.

2. Перейдите в папку yc-serverless-alice-shareable-todolist/frontend и выполните команду:

   npm run build
   

   Если в процессе компиляции возникает ошибка:

   • ERR_OSSL_EVP_UNSUPPORTED, создайте переменную NODE_OPTIONS:

     export NODE_OPTIONS=--openssl-legacy-provider
     

   • npm ERR! Could not resolve dependency, выполните команду:

     npm install --legacy-peer-deps && npm install --force
     

   Результат:

   > todolist@0.1.0 build
   > react-scripts build
   
   Creating an optimized production build...
   Compiled successfully.
   
   File sizes after gzip:
   
     75.93 KB  build/static/js/2.84be0fca.chunk.js
     23.26 KB  build/static/css/2.ef9168ec.chunk.css
     2.63 KB   build/static/js/main.d9e069c9.chunk.js
     776 B     build/static/js/runtime-main.676997b0.js
     402 B     build/static/css/main.e5cbab88.chunk.css
   
   The project was built assuming it is hosted at /.
   You can control this with the homepage field in your package.json.
   
   The build folder is ready to be deployed.
   You may serve it with a static server:
   
     npm install -g serve
     serve -s build
   

3. Чтобы загрузить файлы в Object Storage, выполните команду:

   cd ../
   ./upload_static.sh
   

   Результат:

   ./upload_static.sh
   upload: frontend/build/robots.txt to s3://frontent-statics/robots.txt
   upload: frontend/build/manifest.json to s3://frontent-statics/manifest.json
   upload: frontend/build/static/css/main.e5cbab88.chunk.css.map to s3://frontent-statics/static/css/main.e5cbab88.chunk.css.map
   upload: frontend/build/index.html to s3://frontent-statics/index.html
   upload: frontend/build/asset-manifest.json to s3://frontent-statics/asset-manifest.json
   upload: frontend/build/static/js/2.84be0fca.chunk.js.LICENSE.txt to s3://frontent-statics/static/js/2.84be0fca.chunk.js.LICENSE.txt
   upload: frontend/build/static/css/main.e5cbab88.chunk.css to s3://frontent-statics/static/css/main.e5cbab88.chunk.css
   upload: frontend/build/static/js/main.d9e069c9.chunk.js to s3://frontent-statics/static/js/main.d9e069c9.chunk.js
   upload: frontend/build/static/js/2.84be0fca.chunk.js to s3://frontent-statics/static/js/2.84be0fca.chunk.js
   upload: frontend/build/static/js/runtime-main.676997b0.js to s3://frontent-statics/static/js/runtime-main.676997b0.js
   upload: frontend/build/static/js/runtime-main.676997b0.js.map to s3://frontent-statics/static/js/runtime-main.676997b0.js.map
   upload: frontend/build/static/js/main.d9e069c9.chunk.js.map to s3://frontent-statics/static/js/main.d9e069c9.chunk.js.map
   upload: frontend/build/static/css/2.ef9168ec.chunk.css to s3://frontent-statics/static/css/2.ef9168ec.chunk.css
   upload: frontend/build/static/css/2.ef9168ec.chunk.css.map to s3://frontent-statics/static/css/2.ef9168ec.chunk.css.map
   upload: frontend/build/static/js/2.84be0fca.chunk.js.map to s3://frontent-statics/static/js/2.84be0fca.chunk.js.map
   

./update_gateway.sh

Результат:

done (2s)
id: d5dsj4st2g81********
folder_id: b1g86q4m5vej********
created_at: "2024-10-22T16:01:54.777Z"
name: gate-1
status: ACTIVE
domain: d5dm1lba80md********.i9******.apigw.yandexcloud.net
connectivity:
  network_id: enp3srbi9u49********
log_options:
  folder_id: b1g86q4m5vej********
execution_timeout: 300s

1. Перейдите в Яндекс Диалоги и авторизуйтесь в консоли.
2. Нажмите Создать диалог и выберите тип диалога Навык.
3. В поле Имя навыка укажите Списки дел.
4. В поле Backend включите опцию Функция в Яндекс Облаке и выберите из списка функцию todolist-alice, которую вы ранее создали в сервисе Cloud Functions.
5. Включите опцию Использовать хранилище данных в навыке.
6. Заполните обязательные поля в разделе Публикация в каталоге. Остальные параметры задайте по своим предпочтениям. Например, можно задать разные словоформы для активации навыка, выбрать голос или тип доступа к навыку.
7. Нажмите Сохранить внизу страницы.

Подробнее см. в документации сервиса Яндекс Диалоги.

1. Перейдите на вкладку Связка аккаунтов.

2. Введите:

   • Идентификатор приложения — значение поля ClientID приложения, зарегистрированного в Яндекс.OAuth.
   • Секрет приложения — значение поля Client secret приложения, зарегистрированного в Яндекс.OAuth.
   • URL авторизации — https://oauth.yandex.ru/authorize.
   • URL для получения токена — https://oauth.yandex.ru/token.
   • URL для обновления токена — https://oauth.yandex.ru/token.

3. Нажмите Сохранить.

Подробнее о протоколе OAuth 2.0 читайте в RFC 6749.

1. Перейдите на вкладку Настройки.

2. Перейдите на вкладку Интенты и нажмите Создать.

3. Добавьте интенты для каждого действия, возможного в диалоге. Разработанные интенты находятся в папке yc-serverless-alice-shareable-todolist/intents проекта.

4. Введите:

   • Название — произвольное имя, которое будет отображаться в интерфейсе.
   • ID — идентификатор интента, равный имени файла в папке intents.
   • Грамматика — текст грамматики, равный содержимому файла в папке intents.

5. Нажмите Сохранить.

6. Чтобы завершить создание диалога, в правой части страницы нажмите На модерацию.

Подробнее об интентах см. в документации Навыков Алисы.

Перейдите на вкладку Тестирование. В левой части отображается чат с Алисой, в правой — протокол взаимодействия в формате JSON.

Пример диалога:

Давайте я помогу вам со списками!

  Алиса, привет. Создай список Продукты

Готово, создала список "продукты"

  Добавь молоко в Продукты

Готово, добавила "молоко" в "продукты"

  Добавь хлеб

В какой список записать "хлеб"?

  Продукты

Готово, добавила "хлеб" в "продукты"

  Добавь яйца

В какой список записать "яйца"?

  Продукты

Готово, добавила "яйца" в "продукты"

  Алиса, перечисли список Продукты

продукты:
1. молоко
2. хлеб
3. яйца