Outils pour utilisateurs

Outils du site


communication_arduino-javascript_par_websocket

L'idée est de paramétrer votre Wemos ou tout autre micro-controleur esp8266 pour en faire un serveur websocket est ainsi envoyer des données qui seront exploité en javascript.

1-Installation de la librairie - Aller via l’onglet croquis sur : inclure une bibliotheque/gérer les bibliothèques - Dans le bloc de saisie en haut à droite tapez « websocket » - Doit apparaitre dans la liste situé dessous : websocket by Markus Sattler. - Cliquer sur installer

2-Le code pour Arduino

#include <Arduino.h>
#include <ESP8266WiFi.h>
#include <WiFiClient.h> 
#include <WebSocketsServer.h>
#include <Hash.h>

WebSocketsServer webSocket = WebSocketsServer(81);

const char *ssid = "testAP";  //changer le nom ssid pour un autre nom unique 
const char *password = "1234testAP";

bool plug = false;

void webSocketEvent(uint8_t num, WStype_t type, uint8_t * payload, size_t lenght) {

    switch(type) {
        case WStype_DISCONNECTED:
            plug=false;
            Serial.printf("[%u] Disconnected!\n", num);
            break;

        case WStype_CONNECTED:{
             plug=true;
             IPAddress ip = webSocket.remoteIP(num);
             Serial.printf("[%u] Connected from %d.%d.%d.%d url: %s\n", num, ip[0], ip[1], ip[2], ip[3], payload);
             // send message to client
             webSocket.sendTXT(num, "Connected");
                                
            }
            break;

        case WStype_TEXT:
            Serial.printf("[%u] get Text: %s\n", num, payload);
            if(payload[0] == '#') {
            }
            break;
        }
}


void setup() {
   
    Serial.begin(115200);
    Serial.setDebugOutput(true);

    WiFi.softAP(ssid, password);

    IPAddress myIP = WiFi.softAPIP();
    Serial.print("Adresse IP du serveur: ");
    Serial.println(myIP);
    webSocket.begin();
    webSocket.onEvent(webSocketEvent);
}

void loop() {
    webSocket.loop();
    if(plug){
        //lancement d'un message
        webSocket.sendTXT(0,"ca marche");
    }
}

3-Le code html

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>test websocket</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="main.js"></script>
</head>
<body>
</body>
</html>

3-Le code javascript

 //déclaration de la variable message
 var msg;
$(document).ready(function() {
listenSocket();	
});
function listenSocket(){
	//adresse du websocket >>>> changer adresse ip par l'adresse ip de votre arduino (cf la console dans arduino ou l'adresse sera indiqué) . ¡¡¡ Attention bien garder le :81 qui est le port du serveur websocket !!! 
var exampleSocket = new WebSocket("ws://adresseip:81/", ['arduino']);
	//gestion des messages reçus
		   exampleSocket.onopen = function() {
			   console.log('connected');
		   };
		   exampleSocket.onmessage = function(e) {
			   //msg = JSON.parse(e.data)>>> si le message reçu est un json;
			   console.log('message received : ', e.data);
		   };
		   exampleSocket.onclose = function() {
			   console.log('disconnected');
		   };
}

Have fun !!!

communication_arduino-javascript_par_websocket.txt · Dernière modification: 2017/10/08 19:35 par Alexandre Castonguay