1. Build Device Binding UI

The application is used to bind devices to users in Amazon Cognito User Pools. It is built by AWS Amplify. The following is the architect:

Architecture

Overview

The process involves two steps. The first step is the binding between the device and the user, and the second step is for Device Cloud to sends users’ device information back to Alexa when it receives ‘Alexa.Discovery’ command. Let’s understand the steps one by one.

Step 1: Bind device to a user

When bind a device to a user, it will invoke the API and create an record in DynamoDB.

For a physical device, a serial number is usually being used as an uniquely identify a device. In this proposal, the serial number has been encoded into a QR code together with a link to a web page. Customers simply need to scan the QR code to bind the devices. In real word, the QR Code could be packed inside the device.

The following flow chart describes a proposed design of how to bind physical device to users.

  1. Customer scan the QR code with their mobile phone
  2. A web page being rendered on the phone
  3. Redirect to the login page (skip to step 6 if authenticated)
  4. Submit login information and get accessToken and idToken
  5. Get user profile using accessToken
  6. Invoke device binding API
  7. Create device and user relationship in database

The Alexa does not have any requirement for creating the relationship between devices and users. You can always design your own work flow.

Step 2: Alexa retrieves user’s device information

Once the Alexa backend server receives the Alexa.Discovery, the server can retrieve device information from the database and return to Alexa.

How to Run

You could choose either to Deploy this to Amplify console or to develop locally. This is a modern web application, thus the easiest way for deployment is AWS Amplify Console.

The code for this application is located here. Amplify Console supports GitHub, BitBucket, GitLab or CodeCommit as code source. The easiest way to get started is to fork the repo.

  1. Open Amplify Console in AWS Console, click Get started in Deploy session

  2. Choose the Git repo provider and select Continue

  3. Github will automatically ask for the authorization, after that, Choose the repo and branch, select Next

  4. Input App name

  5. Create a new environment, input the environment name of leave it as default

  6. Select or create a new service role, and click Next

  7. Click Save and deploy

Wait for the deployment to be finished. You will be see the URL for the web application.

You will ONLY need to run this if you would like to develop locally. Skip this part if you have already finished Deployment to Amplify Console.

In this application, Yarn and node.js are used to build the application.

  • Please install Yarn and node.js. The easiest way to install NodeJS is NVM.
  • The backend is provisioned via AWS Amplify CLI. The easiest way to install is via npm. If you install NodeJS via NVM, it will come with npm.
  1. Init the backend. Run amplify init, enter dev for environment name
  2. Choose your default editor and AWS profile. Wait for the initialization finished
  3. Run amplify push and type Yes when asked to confirm
  4. Click Enter button to keep the all the rest default settings
  5. Run yarn install to install dependencies
  6. Run yarn start to start the web application
  7. Open http://localhost:3000/?thingName=xxxxxxxx to view it in the browser.
  8. If you are the first time to run the web application. You should click the Create account button to create an account.