-
-
Save dinukasal/dd480e26af1597768e6b7bcd33704d4c to your computer and use it in GitHub Desktop.
AWS IoT-based serverless JS-Webapp Pub/Sub demo
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>AWS IoT Pub/Sub Demo</title> | |
| </head> | |
| <body> | |
| <h1>AWS IoT Pub/Sub Demo</h1> | |
| <form> | |
| <button type="button" id="connect">connect!</button> | |
| <div> | |
| <label for="message">Message to send:</label> | |
| <input type="text" id="message" value="Hello world!" /> | |
| <button type="button" id="send">send!</button> | |
| </div> | |
| </form> | |
| <h2>Log Output</h2> | |
| <ul id="the-log"></ul> | |
| <script src="bundle.js"></script> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| "use strict"; | |
| import v4 from 'aws-signature-v4'; | |
| import crypto from 'crypto'; | |
| import MqttClient from './node_modules/mqtt/lib/client'; | |
| import websocket from 'websocket-stream'; | |
| const AWS_ACCESS_KEY = 'AKIAJG2AAE7GEWVAVO4A'; | |
| const AWS_SECRET_ACCESS_KEY = ''; | |
| const AWS_IOT_ENDPOINT_HOST = 'A3XL158HTUQU5.iot.us-east-1.amazonaws.com'; | |
| const MQTT_TOPIC = '/test/iot-pubsub-demo'; | |
| var client; | |
| addLogEntry('Hello World!'); | |
| document.getElementById('connect').addEventListener('click', () => { | |
| client = new MqttClient(() => { | |
| var url = v4.createPresignedURL( | |
| 'GET', | |
| AWS_IOT_ENDPOINT_HOST.toLowerCase(), | |
| '/mqtt', | |
| 'iotdevicegateway', | |
| crypto.createHash('sha256').update('', 'utf8').digest('hex'), | |
| { | |
| 'key': AWS_ACCESS_KEY, | |
| 'secret': AWS_SECRET_ACCESS_KEY, | |
| 'protocol': 'wss', | |
| 'expires': 15 | |
| } | |
| ); | |
| addLogEntry('Connecting to URL: ' + url); | |
| return websocket(url, [ 'mqttv3.1' ]); | |
| }); | |
| client.on('connect', () => { | |
| addLogEntry('Successfully connected to AWS IoT Broker! :-)'); | |
| client.subscribe(MQTT_TOPIC); | |
| }); | |
| client.on('close', () => { | |
| addLogEntry('Failed to connect :-('); | |
| client.end(); // don't reconnect | |
| client = undefined; | |
| }); | |
| client.on('message', (topic, message) => { | |
| addLogEntry('Incoming message: ' + message.toString()); | |
| }); | |
| }); | |
| document.getElementById('send').addEventListener('click', () => { | |
| const message = document.getElementById('message').value; | |
| addLogEntry('Outgoing message: ' + message); | |
| client.publish(MQTT_TOPIC, message); | |
| }); | |
| function addLogEntry(info) { | |
| const newLogEntry = document.createElement('li'); | |
| newLogEntry.textContent = '[' + (new Date()).toTimeString().slice(0, 8) + '] ' + info; | |
| const theLog = document.getElementById('the-log'); | |
| theLog.insertBefore(newLogEntry, theLog.firstChild); | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "name": "iot-pubsub-demo", | |
| "version": "0.0.1", | |
| "description": "AWS IoT Pub/Sub Demo", | |
| "main": "main.js", | |
| "scripts": { | |
| "test": "echo \"Error: no test specified\" && exit 1" | |
| }, | |
| "author": "Stefan Siegl <[email protected]>", | |
| "license": "MIT", | |
| "devDependencies": { | |
| "babel-core": "^6.7.4", | |
| "babel-loader": "^6.2.4", | |
| "babel-preset-es2015": "^6.6.0", | |
| "webpack": "^1.12.14", | |
| "webpack-dev-server": "^1.14.1" | |
| }, | |
| "dependencies": { | |
| "aws-signature-v4": "^1.0.1", | |
| "mqtt": "^1.7.4", | |
| "websocket-stream": "^3.1.0" | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var path = require('path'); | |
| module.exports = { | |
| entry: './main.js', | |
| output: { | |
| path: __dirname, | |
| filename: 'bundle.js' | |
| }, | |
| module: { | |
| loaders: [ | |
| { | |
| test: /\.jsx?$/, | |
| exclude: /(node_modules|bower_components)/, | |
| loader: 'babel-loader', | |
| query: { | |
| presets: ['es2015'] | |
| } | |
| } | |
| ] | |
| } | |
| }; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment