4 | IoT MQTT System - Activity recognition web app

Activity recognition web app

If you followed the first three parts of my tutorial, you will now have a Mosquitto broker running on an EC2 virtual machine of Amazon AWS service. In case you missed this tutorials, you can find them at the end of this article.

At this point we need to evolve our perspective, so we'll introduce smartphone as a source of data, using a simple web app and the Javascript Generic Sensor API. But we'll also expand the IoT cloud structure, with DynamoDB and the Lambda functions, that allow us elaborating interesting models.

Today I'm going to show you how to set up a simple activity recognition web app, which collects data from your smarphone accelerometer through Generic Sensor API and shares them with the AWS IoT core service. A second web page displays the informations collected by the smarphone. Data elaboration works through two parallel binaries: a cloud computation in which the model is computed by the AWS cloud IoT service and an edge computation, which uses a local smarphone computation and sends directly the resulting state.

Prerequisites

Mobile web app has to be accessed from your smartphone so you will probably need to upload the mobile.html file and js and css directories, contained in the wesite_crowdsensing directory of my repository, on an online hosting, or find a way to access them from your phone. Remember to configure your broker IP in the js script, editing the value of "HOST" variable.

The other web page can be accessed from local host, there is no need to upload it.

Mosquitto bridge and SSL certificate

The Mosquitto broker already installed the first part of my project is no more enough, we'll need to link it with the AWS IoT core service, with a proper bridge. The procedure is really well explained here, just follow all the steps and the bridge will be up. Be sure to don't forget any phase.You will also need an SSL certificate as we'll use secure web sockets. This step can be easily done in this way (many thanks to this article):

• Download this bash script
• Upload the script on your EC2 virtual machine, in the /etc/mosquitto/ directory using this command

scp -i <PATH_TO_EC2_SSH_ACCESS_KEY> <PATH_TO_LOCAL_FILE> <YOUR_INSTANCE_USERNAME>@<YOUR_EC2_IPV6_ADDRESS>:/etc/mosquitto/certs.sh

• Execute the script and copy the generated ca.crt, <YOUR_HOST>.crt and <YOUR_HOST>.key files in the certs directory
• Edit Mosquitto configuration /etc/mosquitto/conf.d/default.conf file with this part:

# MQTT over TLS/SSL
listener 8883
cafile /etc/mosquitto/certs/ca.crt
certfile /etc/mosquitto/certs/<YOUR_HOST>.crt
keyfile /etc/mosquitto/certs/<YOUR_HOST>.key

# WebSockets over TLS/SSL
listener 9883
protocol websockets
cafile /etc/mosquitto/certs/ca.crt
certfile /etc/mosquitto/certs/<YOUR_HOST>.crt
keyfile /etc/mosquitto/certs/<YOUR_HOST>.key

Your broker will now be linked to AWS IoT core services and able to receive secure websockets.

Once you've done this, since the broker certificate will be self signed, you will also need to guarantee a security exception to the website. In order to do this you can access this address from your smartphone browser:

https://HOSTING_ADDRESS/mobile.html:9883/mqtt

Once opened, the browser will prompt you and notice about possible security issues. Accept the risks and go over, from now you won't have to do it anymore.

DynamoDB tables and autmoatic rules

At this point you need to configure the DynamoDB tables which will collect the data and the automatic rules for insertion and computation. You can do this easily:

• Access the AWS console panel and go to the DynamoDB section
• Create two tables, with this names: crowd-edge and crowd-cloud, put "timestamp" in the primary key field

• Go to the IoT core section and enter in action execution, then create a new rule

• The first rule will have "both_directions" as source and will simply put all the messages in the "crowd-edge" table. Hash key: timestamp and Hash value: ${timestamp}
• The second one will have "localgateway_to_awsiot" as source and will do two actions: automatic insertion in "crowd-cloud" table and Lambda function execution. Again Hash key: timestamp and Hash value: ${timestamp}

• Create the lambda rule and link it to the before mentioned automatic IoT rule. You can create one using a pre-written model, as the "python hello world" one, and then replace the code with the following:

from __future__ import print_function
  
import json
import boto3
  
print('Loading function')
  
def lambda_handler(event, context):
  
    # Parse the JSON message 
    eventText = json.dumps(event)
  
    # Print the parsed JSON message to the console. You can view this text in the Monitoring tab in the AWS Lambda console or in the Amazon CloudWatch Logs console.
    print('Received event: ', eventText)
    
    client = boto3.client('iot-data', region_name='us-east-1')
    
    state = ''
    
    if(event["acceleration"] <= 0.6):
        state = 'Stuck'
    elif(event["acceleration"] > 0.6 and event["acceleration"] <= 5):
        state = 'Walking'
    elif(event["acceleration"] > 5):
        state = 'Running'

    # Change topic, qos and payload
    response = client.publish(
        topic='awsiot_to_localgateway',
        qos=0,
        payload=json.dumps({"timestamp": event["timestamp"], "state": state, "acceleration": event["acceleration"]})
    )
  
    print(response)

The service is now ready. Do some tests and check if all it's okay.

Website

Now you can open the website from your pc and data will be displayed. Obviously real time data will appear when phone will open the mobile web page.

Here you can find the other parts of my project:

• Part 1 - Broker, DB and Python stations
• Part 2 - RIOTStations
• Part3 - LoRaWAN and TTN

Project developed as part my MSc degree in Engineering in Computer Science.

Useful links:

• Youtube tutorial
• LinkedIn profile
• Github repository

If you appreciated my work, please like or share it.