WebApp Controlled Gate Operator Add-on (IoT): 20 steg (med bilder)

2024 Författare: John Day | [email protected]. Senast ändrad: 2024-01-30 12:46

Jag har en klient som hade ett grindområde där många människor behövde komma och gå. De ville inte använda en knappsats på utsidan och hade bara ett begränsat antal fjärrkontrollsändare. Att hitta en prisvärd källa för ytterligare fjärrkontroller var svårt. Jag trodde att det skulle vara ett utmärkt tillfälle att uppgradera denna Liftmaster gate -operatör till att vara IoT -kompatibel med anpassad maskinvara, webb -API och webbappgränssnitt. Detta löste inte bara massåtkomstproblemet, det öppnade också ytterligare funktioner!

På det sista fotot ovan är testenheten som jag hade kört i nästan ett år i en dragkedja. Jag trodde att det var dags för en uppgradering!

Detta är en fullt fungerande lösning med all kod, hårdvaruinformation och design som listas här.

Alla projektfiler finns också på GitHub: github.com/ThingEngineer/IoT-Gate-Operator-Addon

Ett exempel på CodeIgniter WebApp -gränssnittet finns här: projects.ajillion.com/gate Denna instans är inte ansluten till en live gate utan är det exakta gränssnittet och koden som körs på grindarna (minus vissa säkerhetsfunktioner).

--

För ännu större integration kan du använda IFTTT -biblioteket för Electric Imp.

Steg 1: Samla delarna

• Du behöver en elektrisk IMP med minst 4 GPIO: er tillgängliga, jag använder IMP001 med ett april -kort.
• En regulator för att sänka källspänningen till 5V. Jag använder en DC-DC Buck Converter Step Down-modul. eBoot MP1584EN version från Amazon.
• En dubbel (eller fler) relämodul eller liknande kopplingsenhet som fungerar med IMP -utgången. Jag använder den här JBtek 4 Channel DC 5V Relay Module från Amazon.
• En 4 -trådig skruvterminal. Jag använder denna 5Pcs 2 Rows 12P Wire Connector Screw Terminal Barrier Block 300V 20A från Amazon.

Steg 2: Tillbehör

Du behöver också:

• Tillgång till en 3D -skrivare eller en liten projektlåda
• 4 små skruvar ca 4 mm x 6 mm för locket
• Anslutningstråd
• Avbitartång
• Wire strippers
• Små skruvmejslar
• Lödkolv
• Varmt lim eller silikon
• Buntband

Steg 3: Storleksanpassa fodralet

Layout dina delar för att avgöra vilken storlek fodral du behöver. Med en layout som på bilden behöver jag ett fodral som är cirka 140 mm brett, 70 mm djupt och 30 mm högt.

Steg 4: Anslut DC-DC-omvandlare

Klipp 3 par röda och svarta anslutningstrådar för strömanslutningar in och ut ur DC-DC-omvandlarkortet.

• Ingång: 100 mm
• Utgång till IMP: 90 mm
• Utgång till relämodul: 130 mm

Löd dem till ditt bräda enligt bilden.

Steg 5: Koppla ström till enheter

• Anslut ingången till DC-DC-omvandlaren till två av punkterna på skruvplinten.
• Löd de korta 5V -utgångskablarna till IMP.
• Löd de längre 5V utgångskablarna till relämodulen.

Steg 6: Ingångar för trådrelämodul

• Klipp 4 x 90 mm trådar för relämodulens ingångsanslutningar. Jag använde 4 separata färger för enkel referens senare under kodningen.
• Löd kablarna till relämodulens ingångar 1-4 och sedan till de första 4 IMP GPIO-platserna (Pin1, 2, 5 och 7).

Steg 7: IMP Power Jumper

Du kan behöva använda USB -ström medan du initialt programmerar och testar din IMP. När du är klar, var noga med att flytta strömbrytaren till BAT -sidan.

Steg 8: Wire Gate Statusingångar

• Klipp 2 x 80 mm trådar för statusstatusingångarna.
• Anslut kablarna till de återstående 2 skruvplintarna.
• Lödtrådar till nästa till IMP GPIO -fläckar (Pin8 & 9) respektive.

Steg 9: Skriv ut eller köp ett fodral

Du kan ladda ner min. STL eller. F3D för detta fall på GitHub eller Thingiverse

Om du inte har tillgång till en 3D -skrivare fungerar ett litet generiskt projektfodral.

Steg 10: Dekorera ditt fodral

Eftersom!

Jag satte lite indränkt text på min och färgade den bara med en svart skärpa. Om du känner dig äventyrlig kan du använda akrylfärg, nagellack eller något annat för att göra det ännu smidigare.

Steg 11: Borrhål för trådar

Borra ett litet hål 10-15 mm på sidan nära mitten av där alla trådar kommer ihop.

Jag använde en Unibit för ett rent, slätt hål i plasten.

Steg 12: Förbered och installera anslutningskablar

Klipp 9 x 5-600 mm trådar för att ansluta enheten till portens styrkort.

• 2 för 24V effektingång
• 3 för grindstatus (2 ingångar och en gemensam mark)
• 2 för signal med öppen grind
• 2 för stängningssignalen

Vrid ihop var och en av grupperna ovan med en borrmaskin. Detta kommer att göra allt enklare och se bättre ut.

Strip och anslut var och en av ledningarna till respektive terminaler enligt bilden.

Steg 13: Route Hookup Wires

Dra anslutningskablarna genom hålet enligt bilden.

Steg 14: Montera komponenter

Placera och montera komponenter med en liten pärla av varmt lim eller silikon. Använd inte för mycket om du behöver ta bort en del, använd tillräckligt för att säkra dem.

Jag ville ursprungligen skriva ut fodralet med klipp/flikar för att hålla brädorna på plats men jag behövde få det installerat och hade inte tid. Att lägga till brädklämmor i ditt fodral skulle vara en fin touch.

Steg 15: Täta anslutningskablar

Förslut anslutningstrådarna med varmt lim eller silikon.

Steg 16: Stäng fodralet

Jag använde små ~ 4 mm skruvar på listan över detta 3D -tryckta fodral. Om du är orolig för smuts eller fukt, lägg en silikonpärla eller varmt lim runt lockfogen innan du stänger den.

Steg 17: Installera i Gate Operator

På huvudkortet:

• Haka fast de två ledningarna som är anslutna till reläutgång 1 till Open Gate -terminalen. (röd/brun på bilder)
• Haka fast de två ledningarna som är anslutna till reläutgång 2 till Close Gate -terminalen. (gul/blå på bilder)
• Haka fast de två ledningarna som är anslutna till DC-DC-omvandlarens ingång till 24V-tillbehörets strömskruvterminaler (rött/svart på bilder)

På expansionskortet

• Jumper reläets vanliga skruvterminaler tillsammans med en liten bit tråd
• Anslut den gemensamma marken till en av reläets gemensamma skruvplintar (grönt på bilder)
• Anslut de 2 portstatusingångarna (IMP Pin8 & 9) till reläets normala öppna (NO) skruvterminaler (grå/gul på bilder)

Dra ledningarna, dragkedja dem för att se snygga ut och hitta en plats att montera eller ställa in ditt fodral.

Det finns ytterligare foton i full upplösning som finns på GitHub -förvaret.

Steg 18: Ställ in Aux Relay Mode

Ställ in hjälpreläets omkopplare enligt bilden.

Detta kommer att ge IMP de signaler den behöver för att avgöra om grinden är stängd, öppen, öppen eller stängd.

Steg 19: IMP -agent och enhetskod

Electric Imp Agent Code:

• Skapa en ny modell i Electric Imp IDE:
• Ersätt URL för att peka på din server

// HTTP -hanteringsfunktion

funktion httpHandler (req, resp) {try {local d = http.jsondecode (req.body); //server.log(d.c); if (d.c == "btn") {//server.log(d.val); device.send ("btn", d.val); resp. skicka (200, "OK"); }} catch (ex) {// Om det uppstod ett fel, skicka tillbaka det i svarsservern.log ("fel:" + ex); resp.send (500, "Internt serverfel:" + ex); }}} // Registrera HTTP -hanterare http.onrequest (httpHandler); // GateStateChange -hanteringsfunktionsfunktionen gateStateChangeHandler (data) {// URL till webbtjänstens lokala url = "https://projects.ajillion.com/save_gate_state"; // Ställ in innehållstyphuvudet till json local headers = {"Content-Type": "application/json"}; // Koda mottagna data och logga lokalt organ = http.jsonencode (data); server.log (kropp); // Skicka data till din webbtjänst http.post (url, rubriker, kropp).sendsync (); } // Registrera gateStateChange handler device.on ("gateStateChange", gateStateChangeHandler);

Electric Imp Agent Code:

• Tilldela din modell en Imp -enhet
• Kontrollera att hårdvarustiften är Alias som anslutna

// Debouce bibliotek

#require "Button.class.nut: 1.2.0" // Alias for gateOpen GPIO pin (active low) gateOpen <- hardware.pin2; // Alias för gateClose kontroll GPIO pin (aktiv låg) gateClose <- hardware.pin7; // Konfigurera 'gateOpen' till en digital utgång med ett startvärde på digital 1 (hög) gateOpen.configure (DIGITAL_OUT, 1); // Konfigurera 'gateClose' för att vara en digital utgång med ett startvärde på digital 1 (hög) gateClose.configure (DIGITAL_OUT, 1); // Alias för GPIO-stiftet som anger att porten rör sig (N. O.) gateMovingState <- Knapp (hardware.pin8, DIGITAL_IN_PULLUP); // Alias för GPIO-stiftet som anger att grinden är helt öppen (N. O.) gateOpenState <- Knapp (hardware.pin9, DIGITAL_IN_PULLUP); // Global variabel för att hålla gate -tillståndet (Open = 1 / Closed = 0) local lastGateOpenState = 0; // Latch Timer -objekt lokalt latchTimer = null agent.on ("btn", funktion (data) {switch (data.cmd) {case "open": gateOpen.write (0); if (latchTimer) imp.cancelwakeup (latchTimer); latchTimer = imp.wakeup (1, releaseOpen); server.log ("Open command received"); break case "latch30m": gateOpen.write (0); if (latchTimer) imp.cancelwakeup (latchTimer); latchTimer = imp.wakeup (1800, releaseOpen); server.log ("Latch30m kommando mottaget"); break case "latch8h": gateOpen.write (0); if (latchTimer) imp.cancelwakeup (latchTimer); latchTimer = imp.wakeup (28800, releaseOpen); server.log ("Latch8h kommando mottaget"); break case "close": if (latchTimer) imp.cancelwakeup (latchTimer); gateOpen.write (1); gateClose.write (0); latchTimer = imp.wakeup (1, releaseClose); server.log ("Stäng nu kommando mottaget"); bryt standard: server.log ("Knappkommando känns inte igen");}}); function releaseOpen () {if (latchTimer) imp.cancelwakeup (latchTimer); gateOpen.write (1); //server.log("Timer släppte gateOpen switch -kontakt "); } function releaseClose () {if (latchTimer) imp.cancelwakeup (latchTimer); gateClose.write (1); //server.log("Timer släppte gateClose switch contact "); } gateMovingState.onPress (funktion () {// Reläet är aktiverat, gate rör sig //server.log("Gate öppnar "); lokala data = {" gatestate ": 1," timer ": hardware.millis ()}; agent.send ("gateStateChange", data);}). onRelease (function () {// Reläet släpps, gate är i vila //server.log("Gate is closed "); local data = {"gatestate": 0, "timer": hardware.millis ()}; agent.send ("gateStateChange", data);}); gateOpenState.onPress (funktion () {// Reläet är aktiverat, gate är helt öppen //server.log("Gate är öppen "); lokala data = {" gatestate ": 2," timer ": hardware.millis ()}; agent.send ("gateStateChange", data);}). onRelease (function () {// Reläet släpps, gate är inte helt öppen //server.log("Gate stängs "); lokal data = {"gatestate": 3, "timer": hardware.millis ()}; agent.send ("gateStateChange", data);});

Steg 20: Webbtjänstens PHP -kod

Jag skrev den här koden för CodeIgniter -ramverket eftersom jag lade till den i ett gammalt befintligt projekt. Kontrollenheten och visningskoden kan enkelt anpassas till den ram du väljer.

För att hålla sakerna enkla sparade jag JSON -data i en platt fil för datalagring. Om du behöver logga eller mer komplexa datarelaterade funktioner använder du en databas.

Ajax-biblioteket jag skrev och använde i det här projektet kan laddas ner från GitHub-förvaret: ThingEngineer/Codeigniter-jQuery-Ajax

PHP -kontrollkod:

• app/controllers/projects.php
• Se till att datavägen är åtkomlig med ditt PHP -skript, både plats- och läs-/skrivrättigheter.

load-> helper (array ('file', 'date'));

$ data = json_decode (read_file ('../ app/logs/gatestate.data'), TRUE); switch ($ data ['gatestate']) {case 0: $ view_data ['gatestate'] = 'Closed'; ha sönder; fall 1: $ view_data ['gatestate'] = 'Öppnar …'; ha sönder; fall 2: $ view_data ['gatestate'] = 'Öppna'; ha sönder; case 3: $ view_data ['gatestate'] = 'Stänger …'; ha sönder; } $ last_opened = json_decode (read_file ('../ app/logs/projects/gateopened.data'), TRUE); $ view_data ['last_opened'] = tidsperiod ($ last_opened ['last_opened'], time ()). ' sedan'; // Load View $ t ['data'] = $ view_data; $ this-> load-> view ('gate_view', $ t); } funktionen save_gate_state () {$ this-> load-> helper ('file'); $ data = file_get_contents ('php: // input'); write_file ('../ app/logs/projects/gatestate.data', $ data); $ data = json_decode ($ data, TRUE); if ($ data ['gatestate'] == 1) {$ last_opened = array ('last_opened' => time ()); write_file ('../ app/logs/projects/gateopened.data', json_encode ($ last_opened)); }} funktion get_gate_state () {$ this-> load-> helper (array ('file', 'date')); $ this-> load-> library ('ajax'); $ data = json_decode (read_file ('../ app/logs/projects/gatestate.data'), TRUE); $ last_opened = json_decode (read_file ('../ app/logs/projects/gateopened.data'), TRUE); $ data ['last_opened'] = tidsperiod ($ last_opened ['last_opened'], time ()). ' sedan'; $ this-> ajax-> output_ajax ($ data, 'json', FALSE); // skicka json -data, verkställ inte ajax -förfrågan}}/ * Slut på filprojekt.php *// * Plats:./application/controllers/projects.php */

PHP View Code:

Jag använde Bootstrap för front-end eftersom det är snabbt, enkelt och lyhörd. Du kan ladda ner den här: https://getbootstrap.com (jQuery ingår)

• app/controllers/gate_view.php
• Ersätt DIN-AGENT-KOD med din Electric Imp agent-kod

IoT Gate Opperator Addon IoT Gate Opperator Addon

• Hem
• Administration

Open Gate Latch Öppen i 30 min Latch Open i 8 timmar Stäng nu Gate Status: Senast öppnade $ (dokument).ready (function () {resetStatus ();}) funktion sendJSON (JSONout) {var url = 'https:// agent.electricimp.com/YOUR-AGENT-CODE '; $.post (url, JSONout); } $ ("#open_gate"). klicka (function () {var JSONout = '{"c": "btn", "val": {"cmd": "open"}}'; sendJSON (JSONout); $ ("#status"). text ("Öppnar …");}); $ ("#latch30m_gate"). klicka (function () {var JSONout = '{"c": "btn", "val": {"cmd": "latch30m"}}'; sendJSON (JSONout); $ ("#status"). text ("Öppnar …");}); $ ("#latch8h_gate"). klicka (function () {var JSONout = '{"c": "btn", "val": {"cmd": "latch8h"}}'; sendJSON (JSONout); $ ("#status"). text ("Öppnar …");}); $ ("#close_gate"). klicka (function () {var JSONout = '{"c": "btn", "val": {"cmd": "close"}}'; sendJSON (JSONout); $ ("#status"). text ("Stänger …");}); function resetStatus () {// Target url var target = 'https://projects.ajillion.com/get_gate_state'; // Begär var data = {agent: 'app'}; // Skicka ajax -postförfrågan $.ajax ({url: target, dataType: 'json', type: 'POST', data: data, success: function (data, textStatus, XMLHttpRequest) {switch (data.gatestate) {case 0: $ ("#status"). Text ('Closed'); break; case 1: $ ("#status"). Text ('Opening …'); break; case 2: $ ("#status").text ('Open'); break; case 3: $ ("#status"). text ('Closing …'); break; default: $ ("#status"). text ('Error');} $ ("#last_opened"). text (data.last_opened);}, error: function (XMLHttpRequest, textStatus, errorThrown) {// Felmeddelande $ ("#status"). text ('Server Error');}})); setTimeout (resetStatus, 3000); }