IOT123 - ASSIMILATE SENSOR HUB: ICOS10 CORS WEBCOMPONENTS: 8 Stappe

2024 Outeur: John Day | [email protected]. Laas verander: 2024-01-31 10:16

Die ASSIMILATE SENSOR/ACTOR Slaves bevat metadata wat gebruik word vir die definiëring van visualisasies in Crouton. Hierdie konstruksie verskil effens van die vorige; daar is geen hardeware veranderinge nie. Die firmware ondersteun nou die aanbied van aangepaste (ryker) redakteurs wat in die nuutste weergawe van AssimilateCrouton geïntegreer kan word. Meer aandag sal gegee word aan die verduideliking van die firmware en die MQTT -dashboard in hierdie artikel.

Een van die voordele om WebComponents te bedien vanaf die toestel wat hulle beheer, is dat die meer gevorderde beheer van die toestel beperk is tot die netwerk waarmee die toestel gekoppel is: u WiFi -toegangspunt. Alhoewel daar 'n ooreenkoms met beskerming is sodra u 'n MQTT -bediener met verifikasie gebruik, kan u in die openbare netwerke iemand op die netwerke verlaat (AssimilateCrouton -webwerf) om u outomatiseringstoestelle te beheer. Hierdie CORS WebComponent -funksie maak dit moontlik om slegs lesings (temp, ligvlakke, vog) in die openbaar te wys en opdragfunksies (aan/af, skedulering) slegs vanaf die toestelnetwerk beskikbaar.

Op die toestel word al die webbedienerfunksies met verifikasie en hosting in SPIFFS steeds ondersteun, maar spesiale fokus is gevestig op CORS (Cross Origin Resource Sharing) -ondersteuning vir Polymer WebComponents (Crouton gebruik Polymer 1.4.0).

In AssimilateCrouton (die vurk van Crouton wat gebruik word vir Assimilate IOT Network) sluit die veranderinge in

• ondersteuning vir 'n toestelkaart (assim-apparaat) wat onder meer individuele kaarte vir 'n toestel vir 'n gebruiker wys en verberg
• info -eiendom op alle kaarte wat 'n heildronk met nuttige kontekstuele inligting vir 'n kaart toon
• ondersteuning vir CORS -webkomponente, in hierdie geval op die webbediener op die toestel (ESP8266).

Stap 1: CROUTON

Crouton is 'n paneelbord waarmee u u IOT -toestelle kan visualiseer en beheer met minimale opstelling. In wese is dit die maklikste paneelbord om op te stel vir enige IOT -hardeware -entoesias wat slegs MQTT en JSON gebruik.

Die ASSIMILATE SLAVES (sensors en akteurs) bevat metadata en eienskappe wat die meester gebruik om die deviceInfo json -pakkie op te bou wat Crouton gebruik om die paneelbord te bou. Die tussenganger tussen ASSIMILATE NODES en Crouton is 'n MQTT -makelaar wat webvasvriendelik is: Mosquito word gebruik vir die demo.

Aangesien die ASSIMILATE MASTER eiendomme versoek, formateer dit die antwoordwaardes in die vereiste formaat vir Crouton -opdaterings. Die AssimilateCrouton -vurk voeg 'n paar funksies by wat u in staat stel om die sakereëls wat u toestel bestuur, te desentraliseer, dws die IOT -toestel het geen ingeboude sakereëls nodig nie; dit is slegs 'n pyplyn vir MQTT/I2C -kommunikasie na die slimmer (ATTINY -beheerde) slawe -akteurs en sensors.

Stap 2: ASSIMILATE CROUTON

WYSIGINGS AAN CROUTON

Veranderinge van die gevurkte weergawe sluit in:

• as 'n eindpunt 'n pad -eienskap gedefinieer het, sal die WebComponent vir die kaart 'n HTMLImport vir 'n CORS -bron (die webserver op die ESP8266 in hierdie build) doen.
• na enige hulpbronne stroomop van (afhanklikhede van) 'n CORS -webkomponent word verwys asof dit vanaf die Crouton -webwerf bedien word; as hulle nie 'n uitsondering laai nie, verwerp die hanteerder die paaie en laai dit van die webwerf af.
• 'n huidige plaaslike tyd word regs bo vertoon, handig vir die skedulering van verifikasie.

POLIEMER -AFHANKLIKHEDE EN KORS

Die blare van 'n polimeerafhanklikheidsboom kan in CORS aangebied word. Omdat die wortelafhanklikes verskeie kere in 'n app gebruik kan word, kan daar nie na hulle verwys word vanaf 2 plekke (die webwerf en die toestel) nie, omdat die Polymer Module Loader dit as twee afsonderlike bronne behandel en verskeie registrasiefoute vinnig 'n toepassing laat vlamvat.

Om hierdie rede is die webkomponent vir 'n kaart (HTML -lêer in 1.4.0) en die gepaardgaande CSS -lêer die enigste lêers wat op die toestel gehuisves word. Daar word na die ander afhanklikhede verwys asof die webkomponent in die 'html' -lêergids op die oorspronklike webwerf gehuisves word, wat dit maklik maak om die webkomponente uit die vouer te ontwikkel totdat dit gereed is om na SPIFFS op die ESP8266 op te laai. AssimilateCrouton sal uitvind hoe om die regte lêers te kry.

ONTWIKKELING

edfungus -skepper van die oorspronklike Crouton het die bron in Pug/Less geskryf en 'n NPM/Grunt -werktuigketting gehad. Ek het die Pug/Less as HTML/css weergegee en net die weergegee lêers geredigeer/versprei. Dit het die NPM/Grunt -werktuigketting gebreek. Dit word behandel in die afdeling TOEKOMS.

U kan die paneelbord plaaslik in u DEV -boks toets:

• Vanaf die opdraglyn in die wortelmap
• npm begin
• die lite-bediener word gespin vir https:// localhost: 10001

Implementeer na 'n statiese webserver:

• kopieer alle vouers behalwe node_modules
• kopieer index.html (en moontlik web.config)

TOEKOMS

Een van die hoofdoelwitte is om na Polymer3 op te gradeer en van die Polymer CLI te werk. Dit is 'n hoë prioriteit om gevorderde redakteurs en raamwerk vir IOT -ontwikkelaars by te voeg om hul eie te ontwikkel. Uiteindelik word die gevorderde outomatiese stelsel heeltemal uitgevoer deur losstaande MQTT -kliënte soos AssimilateCrouton.

'N Voorbeeld van die deviceInfo-pakkie wat gebruik word vir AssimilateCrouton:

{

"deviceInfo": {

"endPoints": {

"CC_device": {

"device_name": "ash_mezz_A3",

"card-type": "assim-toestel",

"ssid": "Corelines_2",

"ip_addr": "192.168.8.104",

"eindpunte": [

{

"title": "Groei ligte",

"card-type": "crouton-simple-toggle",

"eindpunt": "skakelaar"

},

{

"title": "Planter Lights",

"card-type": "crouton-assim-weekview",

"eindpunt": "CC_skakelaar"

}

]

},

"CC_switch": {

"card-type": "assim-weekview",

"info": "Skakel die ligte aan of af in 15 minute tydgleuwe",

"pad": "https://192.168.8.104/cors",

"title": "Planter Lights",

"interval_min": 15,

"waardes": {

"waarde": ""

}

},

"skakel": {

"title": "Groei ligte",

"card-type": "crouton-simple-toggle",

"info": "Skakel ligte aan of af op ad hoc -basis",

"etikette": {

"false": "UIT",

"true": "AAN"

},

"ikone": {

"false": "sun-o",

"true": "sun-o"

},

"waardes": {

"waarde": 0

}

}

},

"status": "goed",

"naam": "ash_mezz_A3",

"description": "Kantoor in Ashmore, Mezzanine, gebied A2",

"color": "#4D90FE"

}

}

sien rawdeviceInfo.json aangebied deur ❤ deur GitHub

Stap 3: TOESTEL VERGADERING

Aangesien daar geen hardeware -veranderinge is nie, is hier die skakels na die relevante inligting:

• Skulpontering
• Materiaal en gereedskap
• MCU -voorbereiding
• Voorbereiding van MCU -behuising
• Bou die Slawe Laagkantskakelaar/RESET Dogterbord
• Die samestelling van die belangrikste komponente

Stap 4: FIRMWARE

HOOF VERANDER HIERDIE BOU

Vir die AssimilateCrouton -toepassing om CORS -hulpbronne vanaf die toestel te kon gebruik, moes reaksieopskrifte op 'n spesifieke manier gekonfigureer word. Dit is geïmplementeer in hierdie weergawe van die firmware (static_server.ino => server_file_read ()).

Die belangrikste afhanklikheidsgrafiek vir Polymer moes ook van 'n enkele oorsprong kom. 'N Strategie is gebruik om 'n onerror -hanteerder (corsLinkOnError) by die SPIFFS CORS -lêers te voeg om die hulpbronne vanaf die AssimilateCrouton -webwerf te herlaai as dit nie op die toestel gevind word nie.

Daar is 2 nuwe konvensies by die SPIFFS -lêerstelsel gevoeg vir die aanpassing van die eindpunte wat in deviceInfo geskep word - wat AssimilateCrouton gebruik om die paneelkaarte te skep:

• /config/user_card_base.json Eindpunt definisie met runtime veranderlikes wat eers verruil word:,,. Dit is gewoonlik waar die assim-toestelkaart bygevoeg sal word. Dit kommunikeer nie terug met die toestel nie.
• /config/user_card_#.json Eindpunt definisie met runtime veranderlikes wat eers verruil word:,,. Dit is gewoonlik waar die ryk redakteurs, soos 'n assim-weekview-kaart, bygevoeg sal word aan die I2C-slaaf (akteur/sensor) wat verband hou met #.

DIE SKETS/BIBLIOTEKE

In hierdie stadium is die projek verpak as 'n voorbeeld vir die AssimilateBus Arduino -biblioteek. Dit is hoofsaaklik om al die nodige lêers maklik te verkry vanaf die Arduino IDE. Die belangrikste kode -artefakte is:

• mqtt_crouton_esp8266_cors_webcomponents.ino - die belangrikste toegangspunt.
• assimilate_bus.h/assimilate_bus.cpp - die biblioteek wat die I2C -kommunikasie met die Slave Sensor/Actors hanteer
• VizJson.h/VizJson.cpp - die biblioteek wat enige JSON formateer/bou wat via MQTT gepubliseer word
• config.h/config.cpp - die biblioteek wat config -lêers op SPIFFS lees/bokse/skryf
• static_i2c_callbacks.ino - die I2C -terugbelle vir 'n eiendom wat ontvang word en die siklus van slawe -versoeke wat volledig is static_mqtt.ino - die MQTT -funksies
• static_server.ino - die webbediener funksies
• static_utility.ino - helperfunksies

Die statiese INO -funksies is om verskillende redes (in plaas van biblioteke) gebruik, maar hoofsaaklik sodat die Webserver- en MQTT -funksies goed kon speel.

DIE SPIFFS HULPBRONNE

Gedetailleerde verduidelikings van die SPIFFS -lêers kan hier gevind word.

• favicon.ico - hulpbron wat deur Ace Editor gebruik word

• konfig

  • device.json - die konfigurasie vir die toestel (Wifi, MQTT …)
  • slave_metas _#. json - gegenereer tydens runtime vir elke slaafadresnommer (#)
  • user_card _#. json - pasgemaakte eindpunt wat vir elke slaafadresnommer (#) in deviceInfo geïntegreer moet word
  • user_card_base.json - pasgemaakte eindpunt wat geïntegreer moet word in deviceInfo vir die toestel
  • user_meta _#. json - persoonlike metadata ignoreer die van die slawe vir elke slaafadresnommer (#)
  • user_props.json - pasgemaakte eiendomsname om die in die metadata van die slawe te ignoreer

• kors

  • card -webcomponent.css - stylblad vir verskillende pasgemaakte kaarte
  • card -webcomponent.html - webkomponent vir verskillende pasgemaakte kaarte

• redakteur

  • assimilate -logo-p.webp" />
  • edit.htm.gz - gzip van Ace Editor HTML
  • edit.htm.src - oorspronklike HTML van die Ace Editor
  • favicon -32x32-p.webp" />

OPLAAD VAN DIE FIRMWARE

• Die kodebewaarplek kan hier gevind word (kiekie).
• 'N Poskode van die biblioteek kan hier gevind word (kiekie).
• Instruksies vir die invoer van 'n zip -biblioteek hier.
• Sodra die biblioteek geïnstalleer is, kan u die voorbeeld "mqtt_crouton_esp8266_cors_webcomponents" oopmaak.
• Instruksies vir die opstel van Arduino vir die Wemos D1 Mini hier.
• Afhanklikes: ArduinoJson, TimeLib, PubSubClient, NeoTimer (sien aanhangsels as u veranderinge in bewaarplekke breek).

LAAI OP NA SPIFFS

Sodra die kode in die Arduino IDE gelaai is, maak device.json oop in die data/config -lêergids:

• Verander die waarde van wifi_ssid met u WiFi SSID.
• Verander die waarde van wifi_key met u WiFi -sleutel.
• Verander die waarde van mqtt_device_name met u toestelidentifikasie wat u verkies (geen verbinding nodig nie).
• Verander die waarde van mqtt_device_description met u toestelbeskrywing wat u verkies (in Crouton).
• Stoor device.json.
• Laai die datalêers op na SPIFFS.

Die belangrikste toegangspunt vir die AssimilateBus-voorbeeld:

/*

*

*DIE BESIGHEIDSREËLS VIR U TOESTEL WORD VERWAG DEUR MQTT BEHEER - NIE HARD IN DIE FIRMWARE GEBAK NIE

*

* Anders as die opstel en lus in hierdie lêer

* die belangrikste bewegende dele is

* on_bus_ontvang en op_bus_complete in static_i2c_callbacks.ino

* en

* mqtt_publiseer en mqtt_callback in static_mqtt.ino

*

*/

#sluit "types.h" in

#sluit "VizJson.h" in

#sluit "assimilate_bus.h" in

#sluit "debug.h" in

#sluit "config.h" in

#insluit

#insluit // stel MQTT_MAX_PACKET_SIZE op ~ 3000 (of u behoeftes vir deviceInfo json)

#insluit

#insluit

#insluit

#insluit

#insluit

// --------------------------------- GEHEUGSVERKLARINGE

// ------------------------------------------------ - definieer

#definieerDBG_OUTPUT_FLAG2 // 0, 1, 2 MINIMUM, VRYSTELLING, VOL

#define_mqtt_pub_topic "outbox" // CROUTON CONVENTIONS

#define_mqtt_sub_topic "inkassie"

// ------------------------------------------------ - klas voorwerpe

Ontfout _debug (DBG_OUTPUT_FLAG);

AssimilateBus _assimilate_bus;

VizJson _viz_json;

Config _config_data;

WiFiClient _esp_client;

PubSubClient _client (_esp_client);

WiFiUDP Udp;

ESP8266WebServer _server (80);

Neotimer _timer_property_request = Neotimer (5000);

// ------------------------------------------------ - datastrukture / veranderlike

RuntimeDeviceData _runtime_device_data;

EiendomDto _dto_props [50]; // maksimum 10 slawe x maksimum 5 eiendomme

// ------------------------------------------------ - beheer vloei

volatilebool _sent_device_info = vals;

byte _dto_props_index = 0;

bool _fatal_error = vals;

// --------------------------------- FUNKSIE OMVANGVERKLARINGE

// ------------------------------------------------ - static_i2c_callbacks.ino

voidon_bus_received (byte slave_address, byte prop_index, rol rol, char naam [16], char waarde [16]);

voidon_bus_complete ();

// ------------------------------------------------ - static_mqtt.ino

voidmqtt_callback (char* topic, byte* payload, ongetekende lengte);

voidmqtt_loop ();

int8_tmqtt_get_topic_index (char* onderwerp);

voidmqtt_init (constchar* wifi_ssid, constchar* wifi_password, constchar* mqtt_broker, int mqtt_port);

voidmqtt_create_subscriptions ();

voidmqtt_publish (char *root_topic, char *deviceName, char *endpoint, constchar *payload);

boolmqtt_ensure_connect ();

voidmqtt_subscribe (char *root_topic, char *deviceName, char *eindpunt);

voidi2c_set_and_get (byte adres, byte kode, constchar *param);

// ------------------------------------------------ - static_server.ino

String server_content_type_get (string lêernaam);

boolserver_path_in_auth_exclusion (string pad);

boolserver_auth_read (String pad);

boolserver_file_read (string pad);

voidserver_file_upload ();

voidserver_file_delete ();

voidserver_file_create ();

voidserver_file_list ();

voidserver_init ();

voidtime_services_init (char *ntp_server_name, byte time_zone);

time_tget_ntp_time ();

voidsend_ntp_packet (IPAddress & adres);

char *time_stamp_get ();

// ------------------------------------------------ - static_utility.ino

String spiffs_file_list_build (string pad);

voidreport_deserialize_error ();

voidreport_spiffs_error ();

boolcheck_fatal_error ();

boolget_json_card_type (byte slave_address, byte prop_index, char *card_type);

boolget_struct_card_type (byte slave_address, byte prop_index, char *card_type);

boolget_json_is_series (byte slave_address, byte prop_index);

voidstr_replace (char *src, constchar *oldchars, char *newchars);

byte get_prop_dto_idx (byte slave_address, byte prop_index);

// --------------------------------- HOOF

voidsetup () {

DBG_OUTPUT_PORT.begin (115200);

SetupDeviceData device_data;

Serial.println (); Serial.println (); // marge vir konsole -rommel

vertraging (5000);

as (DBG_OUTPUT_FLAG == 2) DBG_OUTPUT_PORT.setDebugOutput (waar);

_debug.out_fla (F ("opstelling"), waar, 2);

// kry die vereiste konfigurasie

as (SPIFFS.begin ()) {

_debug.out_str (spiffs_file_list_build ("/"), waar, 2);

as (! _config_data.get_device_data (device_data, _runtime_device_data)) {

report_deserialize_error ();

terugkeer;

}

} anders {

report_spiffs_error ();

terugkeer;

}

// gebruik die timerwaarde wat in device.json gestel is

_timer_property_request.set (device_data.sensor_interval);

mqtt_init (device_data.wifi_ssid, device_data.wifi_key, device_data.mqtt_broker, device_data.mqtt_port);

time_services_init (device_data.ntp_server_name, device_data.time_zone);

server_init ();

// begin die versameling metadata

_assimilate_bus.get_metadata ();

_assimilate_bus.print_metadata_details ();

mqtt_ensure_connect ();

// benodig sensoreiendom (name) om die versameling van metadata te voltooi

_assimilate_bus.get_properties (on_bus_received, on_bus_complete);

_timer_property_request.reset (); // kan merkbare tyd tot hierdie punt verval, so begin weer

}

voidloop () {

as (! check_fatal_error ()) terugkeer;

mqtt_loop ();

_server.handleClient ();

as (_timer_property_request.repeat ()) {

_assimilate_bus.get_properties (on_bus_received, on_bus_complete);

}

}

sien rawmqtt_crouton_esp8266_cors_webcomponents.ino aangebied deur ❤ deur GitHub

Stap 5: TOESTELKAART

Die toestelkaart (kaarttipe: assim-apparaat) word op die webwerf gehuisves en dit is nie nodig om dit vanaf die toestel te bedien nie (CORS).

Die standaardbladsye bevat:

• Die MQTT -onderwerpe vir lees en skryf op die toestel
• Die toegangspunt waarmee die toestel gekoppel is
• 'N Skakel na die SPIFFS -lêerredakteur wat op die toestel aangebied word met behulp van die ACE EDITOR
• 'N Oog -ikoon wat die bladsy Wys/verberg kaart openbaar.

Die Wys/verberg kaartbladsye:

• Elke kaart as 'n aparte item
• Vet blou lettertipe wanneer dit vertoon word
• Normale swart lettertipe as dit versteek is
• 'N Ikoon wat die tipe kaart uitbeeld.

Die kaart kan versteek word deur op die versteek-knoppie op die kaarte te klik, of op 'n blou-vet lettertipe-item in die lys te klik. Die kaarte kan vertoon word deur op 'n swart-normaal-lettertipe-item in die lys te klik.

Die informasiebroodjies is losweg verwant aan hierdie funksie. As op een van die eindpunte in deviceInfo 'n inligtingseienskap toegewys is, sal 'n infoknoppie langs die versteekknoppie op die kaart verskyn. As u klik, word die kontekstuele inligting wat in die eindpunt gedefinieer word, in die venster "gerooster".

As die toestelkaart nie gedefinieer is nie, word die versteekknoppies nie op die kaarte getoon nie. Dit is omdat daar eenmaal weggesteek is, daar is geen manier om dit weer te wys nie.

Sien ENDPOINT-AANPASSING om te sien hoe die assim-toestelkaart bygevoeg kan word via die SPIFFS-lêers op die ESP8266.

AssimileerCrouton -webkomponent

yster-seine>

div>

WYS VERKLAAR IKOON

ek> span>

TOESTELVORM

MQTT TOPICSdiv>

/outbox/{{endPointJson.device_name}}/*div>

/inkassie/{{endPointJson.device_name}}/*div>

WIFI SSIDdiv>

{{endPointJson.ssid}} div>

IP -adres div>

{{endPointJson.ip_addr}} a> div>

div>

WYS WYS LYS

element>papier-item>

sjabloon>

papierlyskas>

div>

crouton-kaart>

sjabloon>

dom-module>

sien rawassim-device.html wat aangebied word deur ❤ deur GitHub

Stap 6: WEEKVIEW -KAART

Die weekview-kaart (kaarttipe: assim-weekview) word op die toestel gehuisves (cors-lêergids). Dit word ingespuit in die deviceInfo -pakkie wat vir AssimilateCrouton gepubliseer is, deur 'n lêer config/user_card _#. Json by SPIFFS te voeg (in hierdie geval user_card_9.json).

OORSIG

Die weeksdae word aangebied as lyste met tydgleuwe. Die omvang van die tydgleuf word bepaal met die eienskap "interval_mins" in config/user_card _#. Json. Dit moet 'n breukdeel van 'n uur of veelvoude van 'n uur wees, bv. 10, 15, 20, 30, 60, 120, 360. Deur op 'n tydsgleuf te klik, moet 'n aan-toestand vir die betrokke toestel in daardie tyd beveel word. As die tydsgleuf nou is, word 'n opdrag onmiddellik vir die toestel gestuur (gepubliseer). Normaalweg word die toestand elke minuut nagegaan/gepubliseer. Keuses word in LocalStorage gestoor, dus word die tye herlaai met 'n blaaieropdatering.

GEBRUIK GEVALLE

In sy huidige toestand is die weekweergawe geskik vir toestelle wat 'n Toggle -skakelaar kan gebruik om hul toestand te visualiseer, dit wil sê of hulle aan of af is en nadat hulle ingestel is, bly hulle in die toestand. Ligte, waaiers en waterverwarmers is goeie kandidate.

Beperkings/grotte

• Die interval_min moet een van die bogenoemde waardes wees
• Die weekweergawe ondersteun nie kortstondige aksies wat ook geskeduleer is nie, soos om kortliks (5 sekondes) twee keer per dag 'n kraan oop te maak.

TOEKOMS

• Daar word verwag dat kortstondige aksies ondersteun sal word.
• Gesinkroniseerde berging oor toestelle word oorweeg vir die skedule -keuses.

Stap 7: GEPASTE AANPASING

Soos kortliks in FIRMWARE genoem, is daar twee nuwe konvensies wat by die SPIFFS -lêerstelsel gevoeg is om die eindpunte aan te pas. Die JSON -lêers is fragmente wat bygevoeg word by die eindpunteiendom in die deviceInfo -pakkie wat na die MQTT -makelaar geplaas word, wat die definisie van die paneelbord word.

Die sleutels van die eindpunte word in firmware gegenereer:

• CC_device (pasgemaakte kaart) vir die user_card_base.json
• CC_SLAVE_ENDPOINT NAME vir die user_card _#. Json (# synde die slawe -adres)

Soos voorheen genoem, is daar veranderlikes wat tydens runtime vervang word met waardes:

• mqtt_device_name
• wifi_ssid
• local_ip

user_card_base.json

N voorbeeld:

user_card _#. json

N voorbeeld:

Stap 8: VIDEOS