-
-
Save lakshmantgld/ade987d6a95c25974b79cdf0d1378cb6 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 <stesie@brokenpipe.de>", | |
| "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
how do you reconnect