Creating a skill for Alice and a website with authorization

1. Install Windows Subsystem for Linux (WSL) to use Linux.
2. Run WSL (Ubuntu by default).
3. Configure the environment as described in this guide for Linux.

1. Go to the Yandex Cloud management console and select the folder where you will perform the operations.
2. On the folder page, click Create resource and select Bucket.
3. In the ** Name** field, enter a name for the bucket consistent with the naming conventions:
4. In the Object read access, Object listing access, and Read access to settings fields, select Restricted.
5. Specify the maximum size of the bucket in GB.
6. Click Create bucket.

1. In the management console, select the folder you are using to complete this tutorial.
2. In the list of services, select API Gateway.
3. Click Create API gateway.
4. In the Name field, enter gate-1.
5. Click Create.
6. Wait for the API gateway status to change to Active.
7. Select the created API gateway.
8. Find the ID and Default domain fields and save their values. You will need them to configure the skill.

1. In the management console, select the folder where you created the bucket.

2. Select Managed Service for YDB.

3. Click Create a database.

4. Specify a Name for the database. Follow these naming requirements:

   • It must be from 2 to 63 characters long.
   • It can only contain lowercase Latin letters, numbers, and hyphens.
   • It must start with a letter and cannot end with a hyphen.

5. Under Database type, select Serverless.

6. Click Create a database.

7. Wait for the database status to change to Running.

8. Select the created database.

9. Under Connection, find the Endpoint field and save its value. You will need it when creating functions.

1. Go to the Yandex OAuth website and log in.

2. Click Create app.

3. Specify the appropriate app name and upload an icon.

4. Under Platforms, select Web services and click Save and continue.

5. Under Platforms, specify the following URIs in the Redirect URI field:

   • https://social.yandex.net/broker/redirect
   • <API_gateway_service_domain>/receive-token.

   Leave the Suggest Hostname field blank.

6. Click Save and continue.

7. Under Permissions, select Access to user avatar and click Save and continue.

8. Under Email address, specify your email address and click Save and continue.

9. Verify the data and click Everything is correct. Create the app.

You can read more about the service features in the Yandex.OAuth documentation.

1. To create a file from the secure-config-template.json template, navigate to the yc-serverless-alice-shareable-todolist project files folder and run this command:

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

2. Open the secure-config.json file in nano:

   nano secure-config.json
   

3. Substitute these variable values into the file:

   • oauth_secret: Password of the app (Client Secret) registered in Yandex OAuth.
   • hash: Base64-encoded random 64-byte string, e.g., qrJagO5NVwOj0FeTmgYSwUN+XXkiQJMWifvrklF53wT55q80Xk8vmEB3kxhtpDnA1WDC893Z9Bh6QcqK********. You can generate a random value in your terminal using openssl rand -base64 64 | tr -d '\n'.
   • block: Base64-encoded random 32-byte string, e.g., uwk0duFgn2nYyfu2VzJe+MnWKWQrfKaiZijI********. You can generate a random value in your terminal using openssl rand -base64 32 | tr -d '\n'.

   You can generate random values at generate.plus.

1. To create a file from the variables-template.json template, navigate to the project files folder and run this command:

   cp variables-template.json variables.json
   

2. Open the variables.json file in nano:

   nano variables.json
   

3. Substitute these variable values into the file:

   • folder-id: Cloud folder ID.
   • domain: gate-1 API gateway service domain without https://, e.g., d5dbo25bol8n********.apigw.yandexcloud.net.
   • oauth-client-id: ClientID field value of the app registered in Yandex.OAuth.
   • database: Database location, the second part of the previously saved Endpoint field value (following /?database=), e.g., /ru-central1/r1gra875baom********/g5n22e7ejfr1********.
   • database-endpoint: First part of the previously saved Endpoint field value (following grpcs:// and preceding /?database=), e.g., ydb.serverless.yandexcloud.net:2135.
   • yc-profile: Yandex Cloud CLI profile name.
   • secure-config-path: Path to the secure-config.json secrets file.
   • storage-bucket: Name of the bucket you created for storing static data.
   • gateway-id: API gateway gate-1 ID.

With Terraform, you can quickly create a cloud infrastructure in Yandex Cloud and manage it using configuration files. These files store the infrastructure description written in HashiCorp Configuration Language (HCL). If you change the configuration files, Terraform automatically detects which part of your configuration is already deployed, and what should be added or removed.

Terraform is distributed under the Business Source License. The Yandex Cloud provider for Terraform is distributed under the MPL-2.0 license.

For more information about the provider resources, see the relevant documentation on the Terraform website or its mirror.

If you do not have Terraform yet, install it and configure the Yandex Cloud provider.

1. Run the following command in the folder with the app.tf configuration file:

   terraform init
   

   Note

   If you encounter a permission denied error during Terraform provider initialization, run the sudo chown $(whoami) ~/yc-serverless-alice-shareable-todolist command to edit current user's access permissions for the project folder.

2. After successful initialization, create resources by providing the OAuth token for Yandex Cloud authorization:

   terraform apply -var-file ./variables.json -var yc-token=<OAuth_token>
   

   As a result, Terraform will automatically create or update the required resources.

1. Before compiling static files, make sure you have Node.js and the npm package manager installed.

2. Navigate to the yc-serverless-alice-shareable-todolist/frontend directory and run the following command:

   npm run build
   

   If during the compilation you encounter the

   • ERR_OSSL_EVP_UNSUPPORTED error, create a NODE_OPTIONS variable:

     export NODE_OPTIONS=--openssl-legacy-provider
     

   • npm ERR! Could not resolve dependency, run the command:

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

   Result:

   > 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. To upload the files to Object Storage, run this command:

   cd ../
   ./upload_static.sh
   

   Result:

   ./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

Result:

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. Go to Yandex Dialogs and log in to the console.
2. Click Create dialog and select the Skill dialog type.
3. In the Skill name field, specify To-do lists.
4. Under Backend, enable Yandex Cloud function and from the list select the todolist-alice function you created earlier in Cloud Functions.
5. Enable Use data storage in the skill.
6. Fill in the required fields under Publication in folder. Configure the other settings as needed. For example, you can specify various word forms to trigger the skill, select a voice, or set access type.
7. Click Save at the bottom of the page.

For more information, see the Yandex Dialogs documentation.

1. Go to the Account linking tab.

2. Enter the following:

   • Application ID: ClientID field value of the app registered in Yandex.OAuth.
   • Application secret: Client secret field value of the app registered in Yandex.OAuth.
   • Authorization URL: https://oauth.yandex.com/authorize.
   • Get token URL: https://oauth.yandex.com/token.
   • Refresh token URL: https://oauth.yandex.com/token.

3. Click Save.

To learn more about OAuth 2.0, see RFC 6749.

1. Go to the Settings tab.

2. Go to the Intents tab and click Create.

3. Add intents for every action possible in the dialog. The intents you make reside are in the project's yc-serverless-alice-shareable-todolist/intents folder.

4. Enter the following:

   • Name: Any name you want displayed in the interface.
   • ID: Intent ID equal to the name of the file in the intents folder.
   • Grammar: Grammar text equal to the contents of the file in the intents folder.

5. Click Save.

6. To complete creating the dialog, click Submit for moderation on the right side of the page.

To learn more about intents, see Alice's skills.

Navigate to the Testing tab. You will see a chat with Alice on the left and an interaction log in JSON format on the right.

Dialog example:

Let me help you with your lists!

  Hi Alice. Create a Groceries list.

Done, I created a Groceries list.

  Add milk to Groceries.

Done, I added "milk" to Groceries.

  Add bread.

What list should I add "bread" to?

  Groceries.

Done, I added "bread" to Groceries.

  Add eggs.

What list should I add "eggs" to?

  Groceries.

Done, I added "eggs" to Groceries.

  Alice, tell me what's on the Groceries list.

Groceries:
1. Milk
2. Bread
3. Eggs