Complemento de operador de puerta controlado por aplicación web (IoT): 20 pasos (con imágenes)

2024 Autor: John Day | [email protected]. Última modificación: 2024-01-30 08:44

Tengo un cliente que tenía un área cerrada donde mucha gente necesitaba ir y venir. No querían usar un teclado en el exterior y solo tenían un número limitado de transmisores de llavero. Fue difícil encontrar una fuente asequible de llaveros adicionales. Pensé que sería una gran oportunidad actualizar este operador de puerta Liftmaster para que sea compatible con IoT con hardware personalizado, API web e interfaz de aplicación web. ¡Esto no solo resolvió el problema del acceso masivo, sino que también abrió una funcionalidad adicional!

En la última foto de arriba está la unidad de prueba que tuve funcionando durante casi un año en una bolsa ziplock. ¡Pensé que era hora de una actualización!

Esta es una solución completamente funcional con todo el código, la información de hardware y los diseños que se enumeran aquí.

Todos los archivos de proyectos también están alojados en GitHub: github.com/ThingEngineer/IoT-Gate-Operator-Addon

Un ejemplo de la interfaz de la aplicación web CodeIgniter está alojado aquí: projects.ajillion.com/gate Esta instancia no está conectada a una puerta en vivo, pero es la interfaz y el código exactos que se ejecutan en las puertas (menos algunas características de seguridad).

--

Para una integración aún mayor, puede utilizar la biblioteca IFTTT para Electric Imp.

Paso 1: reúna las piezas

• Necesitará un IMP eléctrico con al menos 4 GPIO disponibles, estoy usando el IMP001 con una placa de conexión de abril.
• Un regulador para reducir el voltaje de la fuente a 5V. Estoy usando un módulo reductor convertidor DC-DC Buck. Versión MP1584EN de eBoot de Amazon.
• Un módulo de relé doble (o más) o un dispositivo de conmutación similar que funcionará con la salida de IMP. Estoy usando este módulo de relé JBtek de 4 canales DC 5V de Amazon.
• Un terminal de tornillo de 4 hilos. Estoy usando este bloque de barrera de terminal de tornillo de conector de cable de 5 piezas 2 filas 12P 300V 20A de Amazon.

Paso 2: Suministros

También necesitarás:

• Acceso a una impresora 3D o una pequeña caja de proyecto
• 4 tornillos pequeños de aproximadamente 4 mm x 6 mm para la tapa de la caja
• Conectar cable
• Cortadores de alambre
• Pelacables
• Destornilladores pequeños
• Soldador
• Pegamento caliente o silicona
• Corbatas con cremallera

Paso 3: Evalúe el caso

Diseñe sus piezas para determinar qué tamaño de caja necesitará. Con un diseño como el que se muestra en la imagen, necesitaré un estuche de aproximadamente 140 mm de ancho, 70 mm de profundidad y 30 mm de alto.

Paso 4: Convertidor DC-DC de cable

Corte 3 pares de cables de conexión rojo y negro para las conexiones de alimentación dentro y fuera de la placa del convertidor CC-CC.

• Entrada: 100 mm
• Salida a IMP: 90 mm
• Salida al módulo de relé: 130 mm

Sueldelos a su tablero como se muestra.

Paso 5: Conecte la alimentación a los dispositivos

• Conecte la entrada del convertidor CC-CC a dos de los puntos del bloque de terminales de tornillo.
• Suelde los cables de salida cortos de 5 V al IMP.
• Suelde los cables de salida más largos de 5 V al módulo de relé.

Paso 6: Entradas del módulo de relé de cable

• Corte cables de 4 x 90 mm para las conexiones de entrada del módulo de relés. Usé 4 colores separados para una fácil referencia más adelante mientras codificaba.
• Suelde los cables a las entradas del módulo de relé 1-4 y luego a los primeros 4 puntos IMP GPIO (Pin1, 2, 5 y 7) respectivamente.

Paso 7: Puente de alimentación IMP

Es posible que deba utilizar la alimentación USB mientras programa y prueba inicialmente su IMP. Cuando termine, asegúrese de mover el puente de alimentación hacia el lado BAT.

Paso 8: Entradas de estado de la puerta de alambre

• Corte 2 cables de 80 mm para las entradas de estado de estado.
• Conecte los cables a los 2 terminales de tornillo restantes.
• Suelde los cables al lado de los puntos IMP GPIO (Pin 8 y 9) respectivamente.

Paso 9: Imprima o compre un estuche

Puede descargar mi. STL o. F3D para este caso en GitHub o Thingiverse

Si no tiene acceso a una impresora 3D, un pequeño caso de proyecto genérico funcionará.

Paso 10: decora tu estuche

¡Porque!

Puse un texto sangrado en el mío y lo coloreé con un marcador negro. Si te sientes aventurero, puedes usar pintura acrílica, esmalte de uñas o algo más para hacerlo aún más resbaladizo.

Paso 11: Taladre un orificio para cables

Taladre un pequeño orificio de 10 a 15 mm en el lado cerca del centro de donde se unirán todos los cables.

Usé un Unibit para un agujero limpio y liso en el plástico.

Paso 12: Prepare e instale los cables de conexión

Corte cables de 9 x 5-600 mm para conectar nuestro dispositivo a la placa del operador de la puerta.

• 2 para la entrada de alimentación de 24 V
• 3 para el estado de la puerta (2 entradas y una tierra común)
• 2 para la señal de puerta abierta
• 2 para la señal de puerta cerrada

Reúna cada uno de los grupos enumerados anteriormente con un taladro. Esto hará que todo sea más fácil y se verá mejor.

Pele y conecte cada uno de los cables a los terminales respectivos como se muestra.

Paso 13: Enrute los cables de conexión

Pase los cables de conexión a través del orificio como se muestra.

Paso 14: Monte los componentes

Coloque y monte los componentes con una pequeña gota de pegamento caliente o silicona. No use demasiado en caso de que necesite quitar una pieza, use solo lo suficiente para asegurarlas.

Originalmente quería imprimir el estuche con clips / pestañas para mantener las tablas en su lugar, pero necesitaba instalarlo y no tenía tiempo. Agregar clips de tablero a su estuche sería un buen toque.

Paso 15: Selle los cables de conexión

Selle los cables de conexión con pegamento caliente o silicona.

Paso 16: cierre el caso

Usé tornillos pequeños de ~ 4 mm en la lista de esta carcasa impresa en 3D. Si le preocupa la suciedad o la humedad, coloque una gota de silicona o pegamento caliente alrededor de la junta de la tapa antes de cerrarla.

Paso 17: instalar en el operador de puerta

En el tablero principal:

• Enganche los dos cables conectados a la salida de relé 1 al terminal Open Gate. (rojo / marrón en las fotos)
• Enganche los dos cables conectados a la salida de relé 2 al terminal Close Gate. (amarillo / azul en las fotos)
• Enganche los dos cables conectados a la entrada del convertidor CC-CC a los terminales de tornillo de alimentación de accesorios de 24 V (rojo / negro en las fotos)

En la placa de expansión

• Puentee los terminales de tornillo común del relé junto con un pequeño trozo de cable
• Conecte la tierra común a uno de los terminales de tornillo comunes del relé (verde en las fotos)
• Conecte las 2 entradas de estado de la puerta (IMP Pin8 y 9) a los terminales de tornillo de apertura normal (NO) del relé (gris / amarillo en las fotos)

Enrute los cables, átelos con cremallera para que se vean prolijos y encuentre un lugar para montar o colocar su estuche.

Hay fotos adicionales de resolución completa, alojadas en el repositorio de GitHub.

Paso 18: Configure el modo de relé auxiliar

Configure los interruptores de relé auxiliares como se muestra en la foto.

Esto le dará al IMP las señales que necesita para determinar si la puerta está cerrada, abriéndose, abierta o cerrándose.

Paso 19: Código de dispositivo y agente IMP

Código de agente de diablillo eléctrico:

• Cree un nuevo modelo en el IDE de Electric Imp:
• Reemplazar URL para apuntar a su servidor

// función de controlador

función 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.send (200, "OK"); }} catch (ex) {// Si hubo un error, devuélvalo en la respuesta server.log ("error:" + ex); resp.send (500, "Error interno del servidor:" + ex); }} // Registrar el controlador HTTP http.onrequest (httpHandler); // Función del controlador GateStateChange function gateStateChangeHandler (data) {// URL al servicio web local url = "https://projects.ajillion.com/save_gate_state"; // Establecer el encabezado Content-Type en json local headers = {"Content-Type": "application / json"}; // Codifica los datos recibidos y registra el cuerpo local = http.jsonencode (data); server.log (cuerpo); // Envíe los datos a su servicio web http.post (url, encabezados, cuerpo).sendsync (); } // Registrar el dispositivo controlador gateStateChange.on ("gateStateChange", gateStateChangeHandler);

Código de agente de diablillo eléctrico:

• Asignar un dispositivo Imp a su modelo
• Verifique que los pines de hardware tengan un alias como están conectados

// Biblioteca Debouce

#require "Button.class.nut: 1.2.0" // Alias para gateOpen pin GPIO (activo bajo) gateOpen <- hardware.pin2; // Alias para gateClose control pin GPIO (activo bajo) gateClose <- hardware.pin7; // Configurar 'gateOpen' para que sea una salida digital con un valor inicial de digital 1 (alto) gateOpen.configure (DIGITAL_OUT, 1); // Configure 'gateClose' para que sea una salida digital con un valor inicial de digital 1 (alto) gateClose.configure (DIGITAL_OUT, 1); // Alias para el pin GPIO que indica que la puerta se está moviendo (N. O.) gateMovingState <- Botón (hardware.pin8, DIGITAL_IN_PULLUP); // Alias para el pin GPIO que indica que la puerta está completamente abierta (N. O.) gateOpenState <- Button (hardware.pin9, DIGITAL_IN_PULLUP); // Variable global para mantener el estado de la puerta (Abierto = 1 / Cerrado = 0) local lastGateOpenState = 0; // Latch Timer objeto local latchTimer = null agent.on ("btn", function (data) {switch (data.cmd) {case "open": gateOpen.write (0); if (latchTimer) imp.cancelwakeup (latchTimer); latchTimer = imp.wakeup (1, releaseOpen); server.log ("Comando de apertura recibido"); break case "latch30m": gateOpen.write (0); if (latchTimer) imp.cancelwakeup (latchTimer); latchTimer = imp.wakeup (1800, releaseOpen); server.log ("Comando Latch30m recibido"); break case "latch8h": gateOpen.write (0); if (latchTimer) imp.cancelwakeup (latchTimer); latchTimer = imp.wakeup (28800, releaseOpen); server.log ("Comando Latch8h recibido"); break case "close": if (latchTimer) imp.cancelwakeup (latchTimer); gateOpen.write (1); gateClose.write (0); latchTimer = imp.wakeup (1, releaseClose); server.log ("Se recibió el comando Cerrar ahora"); break default: server.log ("Comando de botón no reconocido");}}); function releaseOpen () {if (latchTimer) imp.cancelwakeup (latchTimer); gateOpen.write (1); //server.log("Timer liberado gateOpen switch contact "); } function releaseClose () {if (latchTimer) imp.cancelwakeup (latchTimer); gateClose.write (1); //server.log("Timer liberado gateClose switch contact "); } gateMovingState.onPress (function () {// El relé está activado, la puerta se está moviendo //server.log("Gate is opening "); datos locales = {" gatestate ": 1," timer ": hardware.millis ()}; agent.send ("gateStateChange", data);}). onRelease (function () {// El relé se libera, la puerta está en reposo //server.log("Gate is closed "); datos locales = {"gatestate": 0, "timer": hardware.millis ()}; agent.send ("gateStateChange", data);}); gateOpenState.onPress (function () {// El relé está activado, la puerta está completamente abierta //server.log("Gate is open "); datos locales = {" gatestate ": 2," timer ": hardware.millis ()}; agent.send ("gateStateChange", data);}). onRelease (function () {// El relé está liberado, la puerta no está completamente abierta //server.log("Gate is close "); datos locales = {"gatestate": 3, "timer": hardware.millis ()}; agent.send ("gateStateChange", data);});

Paso 20: Código PHP del servicio web

Escribí este código para el marco CodeIgniter porque lo agregué a un antiguo proyecto existente. El controlador y el código de vista se pueden adaptar fácilmente al marco de su elección.

Para simplificar las cosas, guardé los datos JSON en un archivo plano para el almacenamiento de datos. Si necesita funciones de registro o relacionadas con datos más complejas, utilice una base de datos.

La biblioteca ajax que escribí y usé en este proyecto se puede descargar desde el repositorio de GitHub: ThingEngineer / Codeigniter-jQuery-Ajax

Código del controlador PHP:

• app / controllers / projects.php
• Asegúrese de que su secuencia de comandos PHP pueda acceder a la ruta de datos, tanto la ubicación como los privilegios de lectura / escritura.

load-> helper (array ('archivo', 'fecha'));

$ datos = json_decode (read_file ('../ app / logs / gatestate.data'), TRUE); switch ($ data ['gatestate']) {caso 0: $ view_data ['gatestate'] = 'Cerrado'; rotura; caso 1: $ view_data ['gatestate'] = 'Abriendo…'; rotura; caso 2: $ view_data ['gatestate'] = 'Abrir'; rotura; caso 3: $ view_data ['gatestate'] = 'Cerrando…'; rotura; } $ last_opened = json_decode (read_file ('../ app / logs / projects / gateopened.data'), TRUE); $ view_data ['last_opened'] = intervalo de tiempo ($ last_opened ['last_opened'], time ()). ' atrás'; // Cargar Vista $ t ['datos'] = $ view_data; $ this-> load-> view ('gate_view', $ t); } función save_gate_state () {$ this-> load-> helper ('archivo'); $ datos = file_get_contents ('php: // entrada'); write_file ('../ app / logs / projects / gatestate.data', $ datos); $ datos = json_decode ($ datos, VERDADERO); if ($ data ['gatestate'] == 1) {$ last_opened = array ('last_opened' => time ()); write_file ('../ app / logs / projects / gateopened.data', json_encode ($ last_opened)); }} function get_gate_state () {$ this-> load-> helper (array ('archivo', 'fecha')); $ esto-> cargar-> biblioteca ('ajax'); $ datos = 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'] = intervalo de tiempo ($ last_opened ['last_opened'], time ()). ' atrás'; $ esto-> ajax-> output_ajax ($ datos, 'json', FALSO); // enviar datos json, no hacer cumplir la solicitud ajax}} / * Fin del archivo projects.php * / / * Ubicación:./application/controllers/projects.php * /

Código de vista PHP:

Usé Bootstrap para el front-end porque es rápido, fácil y receptivo. Puede descargarlo aquí: https://getbootstrap.com (jQuery está incluido)

• app / controllers / gate_view.php
• Reemplace YOUR-AGENT-CODE con su código de agente de Electric Imp

Complemento de operador de puerta de IoT Complemento de operador de puerta de IoT

• Hogar
• Administración

Abrir Pestillo de puerta Abierto por 30 min Pestillo Abierto por 8 horas Cerrar ahora Estado de puerta: Último abierto $ (documento).ready (function () {resetStatus ();}) function sendJSON (JSONout) {var url = 'https:// agent.electricimp.com/YOUR-AGENT-CODE '; $.post (url, JSONout); } $ ("# open_gate"). click (function () {var JSONout = '{"c": "btn", "val": {"cmd": "open"}}'; sendJSON (JSONout); $ ("#status"). text ("Abriendo…");}); $ ("# latch30m_gate"). click (function () {var JSONout = '{"c": "btn", "val": {"cmd": "latch30m"}}'; sendJSON (JSONout); $ ("#status"). text ("Abriendo…");}); $ ("# latch8h_gate"). click (function () {var JSONout = '{"c": "btn", "val": {"cmd": "latch8h"}}'; sendJSON (JSONout); $ ("#status"). text ("Abriendo…");}); $ ("# close_gate"). click (function () {var JSONout = '{"c": "btn", "val": {"cmd": "close"}}'; sendJSON (JSONout); $ ("#status"). text ("Cerrando …");}); function resetStatus () {// URL de destino var target = 'https://projects.ajillion.com/get_gate_state'; // Solicitar var data = {agent: 'app'}; // Enviar solicitud de publicación ajax $.ajax ({url: target, dataType: 'json', type: 'POST', data: data, success: function (data, textStatus, XMLHttpRequest) {switch (data.gatestate) {case 0: $ ("# estado"). Texto ('Cerrado'); descanso; caso 1: $ ("# estado"). Texto ('Apertura …'); descanso; caso 2: $ ("# estado").text ('Open'); break; case 3: $ ("# estado"). text ('Cerrando…'); break; predeterminado: $ ("# status"). text ('Error');} $ ("#last_opened"). text (data.last_opened);}, error: function (XMLHttpRequest, textStatus, errorThrown) {// Mensaje de error $ ("# status"). text ('Error del servidor');}}); setTimeout (resetStatus, 3000); }