物联网之ESP32与微信小程序实现指示灯、转向灯


ESP32

代码

cpp 复制代码
#include <WiFi.h>
#include <WebServer.h>
#include <ArduinoJson.h>

const char* ssid = "jifu";
const char* pass = "2022xinchan!@#";
const int dateTime = 500;
const int ledPin4 = 4;
const int ledPin5 = 5;
bool isLTS = false;
bool isRTS = false;
bool isDFL = false;

WebServer server(8068);

// 封装响应函数
void sendResponse(int code, const char* status, const char* message, const String& originId, const String& newId) {
  StaticJsonDocument<200> doc;
  doc["code"] = code;
  doc["status"] = status;
  doc["message"] = message;

  JsonObject responseObj = doc.createNestedObject("response");
  responseObj["originId"] = originId;
  responseObj["newId"] = newId;

  String res;
  serializeJson(doc, res);
  server.send(code, "application/json", res);
}

// 封装指示灯错误响应
void fnIndicatorLightSendResponseError(const String& originId, const String& newId) {
  isLTS = false;
  isRTS = false;
  isDFL = false;
  sendResponse(500, "failure", "失败", originId, newId);
}

// 封装指示灯
void fnEncapsula(int pin1, int pin2) {
  if (pin1 != 1) digitalWrite(pin1, HIGH);
  if (pin2 != 1) digitalWrite(pin2, HIGH);
  delay(dateTime);
  if (pin1 != 1) digitalWrite(pin1, LOW);
  if (pin2 != 1) digitalWrite(pin2, LOW);
  delay(dateTime);
}

// 左转灯
void leftTurnSignal() {
  fnEncapsula(ledPin4, 1);
}

// 右转灯
void rightTurnSignal() {
  fnEncapsula(1, ledPin5);
}

// 双闪灯
void doubleFlashingLights() {
  fnEncapsula(ledPin4, ledPin5);
}

// 指示灯
void fnIndicatorLight() {
  String originId = server.arg("originId");
  String newId = server.arg("newId");
  if (originId == "") {
    int id = newId.toInt();

    switch (id) {
      case 1:
        isLTS = true;
        sendResponse(200, "success", "左转灯已开启", originId, newId);
        break;
      case 2:
        isRTS = true;
        sendResponse(200, "success", "右转灯已开启", originId, newId);
        break;
      case 3:
        isDFL = true;
        sendResponse(200, "success", "双闪灯已开启", originId, newId);
        break;
      default:
        fnIndicatorLightSendResponseError(originId, newId);
        break;
    }
  } else if (newId == "") {
    int id = originId.toInt();

    switch (id) {
      case 1:
        isLTS = false;
        sendResponse(200, "success", "左转灯已关闭", originId, newId);
        break;
      case 2:
        isRTS = false;
        sendResponse(200, "success", "右转灯已关闭", originId, newId);
        break;
      case 3:
        isDFL = false;
        sendResponse(200, "success", "双闪灯已关闭", originId, newId);
        break;
      default:
        fnIndicatorLightSendResponseError(originId, newId);
        break;
    }
  } else if (originId != "" && newId != "") {
    if (newId == "1") {
      isLTS = true;
      isRTS = false;
      isDFL = false;
      sendResponse(200, "success", "左转灯已开启", originId, newId);
    } else if (newId == "2") {
      isLTS = false;
      isRTS = true;
      isDFL = false;
      sendResponse(200, "success", "右转灯已开启", originId, newId);
    } else if (newId == "3") {
      isLTS = false;
      isRTS = false;
      isDFL = true;
      sendResponse(200, "success", "双闪灯已开启", originId, newId);
    } else {
      fnIndicatorLightSendResponseError(originId, newId);
    }
  } else {
    fnIndicatorLightSendResponseError(originId, newId);
  }
}

// 初始化WiFi服务
void runInit() {
  WiFi.mode(WIFI_STA);
  WiFi.begin(ssid, pass);
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print("Loading in progress...");
  }
  pinMode(ledPin4, OUTPUT);
  pinMode(ledPin5, OUTPUT);
  Serial.print("\nWiFiIP: ");
  Serial.println(WiFi.localIP());
}

// 主函数
void setup() {
  Serial.begin(9600);
  runInit();
  server.on("/api/apiIndicatorLight", HTTP_GET, fnIndicatorLight);
  server.begin();
}

// 循环函数
void loop() {
  server.handleClient();
  if (isLTS) leftTurnSignal();
  if (isRTS) rightTurnSignal();
  if (isDFL) doubleFlashingLights();
}

解析

敬请期待...


微信小程序

Html

代码

html 复制代码
<view class="d_g gtc1_1fr gg_38">
  <view class="h_208 lh_208 fs_58 fw_b ta_c bc_efefef radius_8 {{activa===item.id?'color_409eff':''}}" wx:for="{{list}}" wx:key="id" data-id='{{item.id}}' catchtap='handleTabBar'>
    {{item.title}}
  </view>
</view>

解析
敬请期待...


JavaScript

代码

javascript 复制代码
// components/IndicatorLight/page.js
import {
  indicatorLight
} from '../../api/indicatorLight.js';

const {
  showToast
} = getApp();

Component({

  /**
   * 组件的属性列表
   */
  properties: {

  },

  /**
   * 组件的初始数据
   */
  data: {
    list: [{
        id: 1,
        title: '左 转'
      },
      {
        id: 2,
        title: '右 转'
      },
      {
        id: 3,
        title: '双 闪'
      }
    ],
    activa: ''
  },

  /**
   * 组件的方法列表
   */
  methods: {
    async handleTabBar({
      target: {
        dataset: {
          id
        }
      }
    }) {
      const that = this;
      const thatData = that.data;
      let originId = thatData.activa;
      let newId = id;

      newId = originId === id ? '' : id;

      let {
        message
      } = await indicatorLight({
        originId,
        newId
      });

      that.setData({
          activa: newId
        },
        () => showToast(message)
      );
    }
  }
})

解析
敬请期待...

相关推荐
前端小巷子7 分钟前
JS实现丝滑文字滚动
前端·javascript·面试
oil欧哟17 分钟前
🧐 我用 Vibe Coding 从 0 到 1 打造 AI 产品,上线一个月效果如何?有什么心得?
前端·产品·vibecoding
霍克itxt点top25 分钟前
NestJS 入门到实战 前端必学服务端新趋势无密分享
前端
xiguolangzi25 分钟前
1panel web服务部署
前端
摘星编程29 分钟前
Cursor Pair Programming:在前端项目里用 AI 快速迭代 UI 组件
前端·人工智能·ui·typescript·前端开发·cursorai
cetcht88881 小时前
安徽某能源企业积极推进运维智能化转型,引入高压配电房机器人巡检系统
运维·人工智能·物联网·机器人·能源
醉方休1 小时前
React Fiber 风格任务调度库
前端·javascript·react.js
北辰alk1 小时前
React Intl 全方位解析:为你的 React 应用注入国际化灵魂
前端
李白白i单身版1 小时前
前端VUE项目实现静默打印,无需用户手动确认
前端
bysking1 小时前
【29 - git bisect】git bisect 命令进行二分定位,排查异常commit bysking
前端