web-dev-qa-db-fra.com

Comment utiliser AWS IoT pour envoyer/recevoir des messages vers/depuis un navigateur Web

Nous essayons d'utiliser l'Internet des objets Amazon Web Services (AWS IoT) pour envoyer des messages depuis/vers un navigateur Web (par exemple:. Étant donné que AWS IoT prend en charge JavaScript, nous attendons qu'il s'agisse de possible. ..

Nous avons effectué une recherche dans la documentation AWS IoT, mais uniquement trouvé exemples côté serveur(exposant les secrets/clés AWS ...)

Existe-t-il de bons exemples ou didacticiels fonctionnant pour utiliser AWS IoT pour envoyer/recevoir des messages via WebSockets/MQTT dans le navigateur (par exemple: authentification avec AWS Cognito)? Merci!

node.jsamazon-web-serviceswebsocketamazon-cognitoaws-iot
31
Jack Carlisle

Voici un exemple utilisant un pool d'identités cognito dans JS pour se connecter, publier et réagir à un abonnement. 

// Configure Cognito identity pool
AWS.config.region = 'us-east-1';
var credentials = new AWS.CognitoIdentityCredentials({
    IdentityPoolId: 'us-east-1:your identity pool guid',
});

// Getting AWS creds from Cognito is async, so we need to drive the rest of the mqtt client initialization in a callback
credentials.get(function(err) {
    if(err) {
        console.log(err);
        return;
    }
    var requestUrl = SigV4Utils.getSignedUrl('wss', 'data.iot.us-east-1.amazonaws.com', '/mqtt',
        'iotdevicegateway', 'us-east-1',
        credentials.accessKeyId, credentials.secretAccessKey, credentials.sessionToken);
    initClient(requestUrl);
});

function init() {
  // do setup stuff
}

// Connect the client, subscribe to the drawing topic, and publish a "hey I connected" message
function initClient(requestUrl) {
    var clientId = String(Math.random()).replace('.', '');
    var client = new Paho.MQTT.Client(requestUrl, clientId);
    var connectOptions = {
        onSuccess: function () {
            console.log('connected');

            // subscribe to the drawing
            client.subscribe("your/mqtt/topic");

            // publish a lifecycle event
            message = new Paho.MQTT.Message('{"id":"' + credentials.identityId + '"}');
            message.destinationName = 'your/mqtt/topic';
            console.log(message);
            client.send(message);
        },
        useSSL: true,
        timeout: 3,
        mqttVersion: 4,
        onFailure: function () {
            console.error('connect failed');
        }
    };
    client.connect(connectOptions);

    client.onMessageArrived = function (message) {

        try {
            console.log("msg arrived: " +  message.payloadString);
        } catch (e) {
            console.log("error! " + e);
        }

    };
}

Documentation pour l'appel credentials.get, ici

N'oubliez pas d'autoriser votre rôle IAM pour vous abonner/publier également. Voici un exemple: 

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "iot:Connect"
            ],
            "Resource": "*"
        },
        {
            "Effect": "Allow",
            "Action": "iot:Receive",
            "Resource": "*"
        },
        {
            "Effect": "Allow",
            "Action": "iot:Subscribe",
            "Resource": [
                "arn:aws:iot:us-east-1::your/mqtt/topic"
            ]
        },
        {
            "Effect": "Allow",
            "Action": "iot:Publish",
            "Resource": [
                "arn:aws:iot:us-east-1::your/mqtt/topic"
            ]
        }
    ]
}
24
Kyle Roche

Si quelqu'un d'autre cherche une solution: voici un didacticiel qui explique, via une simple application de chat, comment obtenir des mises à jour en temps réel dans un frontal ReactJS à l'aide de Serverless et de Websockets sur AWS IOT. Le code source du tutoriel est disponible sur Github .

2
Chris

Il est difficile de trouver de bons tutoriels pour intégrer AWS IoT dans un navigateur. 

En principe, vous devez disposer d'une méthode d'authentification (Facebook, Google, AWS Cognito, votre propre service d'authentification unique avec prise en charge de SAML), puis vous devez suivre les étapes suivantes:

  1. Configurez le pool d'utilisateurs ou le pool d'identités fédérées Cognito avec votre méthode d'authentification.
  2. Dans le navigateur, vous devez implémenter Extended Flow ( https://aws.Amazon.com/blogs/mobile/understanding-Amazon-cognito-authentication-part-4-enhanced-flow/ )
  3. Vous devez AttachPolicy dans l'IoT pour votre utilisateur Cognito identityId - il sera utilisé comme principal (de la même manière que les périphériques utilisent des certificats).
  4. Vous devez créer un client MQTT à l'aide de https://github.com/aws/aws-iot-device-sdk-js et en fournissant les informations temporaires accessKeyId, secretKey et sessionToken reçues de l'authentification Extended Flow.
0
Maciej Dzikowicki