构建基于 PHP 的 Web 界面控制 Arduino Uno

测试视频

接入水族箱和灌溉系统（水泵）测试，运行良好 :) 视频用 Filmora 试用版剪辑，保留水印尊重版权。电脑端/安卓端测试视频见原项目链接。

代码

Arduinautomotion.php PHP

<?php session_start(); ?>
<!DOCTYPE html>
<html>
<?php include 'Arduinautomotioncontrol.php'; ?>
<head>
<link rel="shortcut icon" href="Arduinautomotion.ico" type="image/x-icon">
<style>
  /* 大量 CSS 样式，含动画、布局、颜色变换等，此处省略以节省篇幅 */
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
  // jQuery 交互逻辑：菜单切换、iframe 自适应等
  // JavaScript 函数：getDataFromArduino() 从 PHP Session 读取传感器/执行器状态，
  // 更新 SVG 圆圈颜色、仪表盘数值，触发危险值警报框(openAlert)
</script>
</head>
<body onpageshow="getDataFromArduino()">
  /* 主体 HTML 结构：背景图、指南 iframe、信息面板、SVG 可视化图形、
     四大区域选择器、表单提交区、页脚动画等 */
</body>
</html>

Arduinautomotioncontrol.php PHP

<?php session_start(); ?>
<!DOCTYPE html>
<html>
<head>
<title>Arduinautomotion</title>
<link rel="shortcut icon" href="Arduinautomotion.ico" type="image/x-icon">
<?php
  $temperatureCelsiusValue = $_SESSION['TemperatureCelsius'];
  $temperatureFahrenheitValue = $_SESSION['TemperatureFahrenheit'];
  $humidityValue = $_SESSION['Humidity'];
  $flamesensorValue = $_SESSION['Flame'];
  $MQ4sensorValue = $_SESSION['MQ4Sensor'];
  $LdrValue = $_SESSION['LDRSensor'];
  $pumpValue = $_SESSION['Airpump'];
  $lampValue = $_SESSION['Lamp'];
  $feedingValue = $_SESSION['Feeding'];
  $heaterValue = $_SESSION['Heater'];
  $filterexValue = $_SESSION['Filterex'];
  $filterinValue = $_SESSION['Filterin'];
  $plant1Value = $_SESSION['Plant1H'];
  $plant2Value = $_SESSION['Plant2H'];
  $plant3Value = $_SESSION['Plant3H'];
  $irrigationValue = $_SESSION['Irrigation'];
?>
</head>
</html>

Arduinautomotionformvalue.php PHP

<?php session_start(); ?>
<!DOCTYPE html>
<html>
<head>
<title>FormValue</title>
<link rel="shortcut icon" href="Arduinautomotion.ico" type="image/x-icon">
<?php
  $_SESSION['Airpump'] = $_POST["pump"];
  $_SESSION['Lamp'] = $_POST["lamp"];
  $_SESSION['Feeding'] = $_POST["feed"];
  $_SESSION['Heater'] = $_POST["heater"];
  $_SESSION['Filterex'] = $_POST["filterexternal"];
  $_SESSION['Filterin'] = $_POST["filterinternal"];
  $_SESSION['Irrigation'] = $_POST["irrigationsystem"];
?>
<style> /* 绿色主题样式 */ </style>
</head>
<body>
<div class="serverpage">
  <h1>Server has received the data from Arduinautomotion.</h1>
</div>
<p>Airpump= <?php echo $_SESSION['Airpump'];?></p><br>
<p>Lamp=<?php echo $_SESSION['Lamp'];?></p><br>
<p>Feeding=<?php echo $_SESSION['Feeding'];?></p><br>
<p>Heater=<?php echo $_SESSION['Heater'];?></p><br>
<p>Filterex=<?php echo $_SESSION['Filterex'];?></p><br>
<p>Filterin=<?php echo $_SESSION['Filterin'];?></p><br>
<p>Irrigation=<?php echo $_SESSION['Irrigation'];?></p><br>
<form action="https://192.168.1.21/" method="get" target="_blank">
  <input type="hidden" value="<?php echo $_SESSION['Airpump'];?>" name="airpump">
  <input type="hidden" value="<?php echo $_SESSION['Lamp'];?>" name="lamp">
  <input type="hidden" value="<?php echo $_SESSION['Feeding'];?>" name="feed">
  <input type="hidden" value="<?php echo $_SESSION['Heater'];?>" name="heater">
  <input type="hidden" value="<?php echo $_SESSION['Filterex'];?>" name="filterex">
  <input type="hidden" value="<?php echo $_SESSION['Filterin'];?>" name="filterin">
  <input type="hidden" value="<?php echo $_SESSION['Irrigation'];?>" name="irrigation">
  <input type="submit" value="Send and Get Data" class="subMit">
</form>
</body>
</html>

Arduinautomotioncommunication.php PHP

<?php session_start(); ?>
<!DOCTYPE html>
<html>
<head>
<title>Communication</title>
<link rel="shortcut icon" href="Arduinautomotion.ico" type="image/x-icon">
<style> body{ background-image: url("https://i.ytimg.com/vi/kkVGBn-haDo/maxresdefault.jpg"); } </style>
<?php
  $_SESSION['TemperatureCelsius'] = $_GET["temperatureCelsius"];
  $_SESSION['TemperatureFahrenheit'] = $_GET["temperatureFahrenheit"];
  $_SESSION['Humidity'] = $_GET["humidity"];
  $_SESSION['Flame'] = $_GET["flame"];
  $_SESSION['MQ4Sensor'] = $_GET["MQ4sensor"];
  $_SESSION['LDRSensor'] = $_GET["LDRsensor"];
  $_SESSION['Plant1H'] = $_GET["plant1H"];
  $_SESSION['Plant2H'] = $_GET["plant2H"];
  $_SESSION['Plant3H'] = $_GET["plant3H"];
?>
</head>
<body></body>
</html>

ArduinoSide_Code.ino Arduino

/////////////////////////////////////////////////////////////////
// -ARDUINAUTOMOTON-
// 创建专业网站与 Arduino 通信 (兼容 Android)
// by Kutluhan Aktar
/////////////////////////////////////////////////////////////////
#include <SPI.h>
#include <Ethernet.h>
#include "DHT.h"

DHT dht;
byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED };
IPAddress ip(192, 168, 1, 21);
EthernetServer server(80);

int pump = 3, lamp = 4, feed = 5, heater = 6, filterex = 7, filterin = 8, irrigation = 9;
String readString;

void setup() {
  Serial.begin(9600);
  pinMode(pump, OUTPUT); pinMode(lamp, OUTPUT); pinMode(feed, OUTPUT);
  pinMode(heater, OUTPUT); pinMode(filterex, OUTPUT); pinMode(filterin, OUTPUT);
  pinMode(irrigation, OUTPUT);
  digitalWrite(pump, HIGH); digitalWrite(lamp, HIGH); digitalWrite(feed, HIGH);
  digitalWrite(heater, HIGH); digitalWrite(filterex, HIGH); digitalWrite(filterin, HIGH);
  digitalWrite(irrigation, HIGH);
  dht.setup(2);
  Ethernet.begin(mac, ip);
  server.begin();
  Serial.print("server is at ");
  Serial.println(Ethernet.localIP());
}

void loop() {
  delay(dht.getMinimumSamplingPeriod());
  float humidity = dht.getHumidity();
  float temperature = dht.getTemperature();
  float fahrenheit = dht.toFahrenheit(temperature);
  int ldrValue = analogRead(A0);
  int flameValue = analogRead(A1);
  int MQ4Value = analogRead(A2);
  int HygValueA = analogRead(A3);
  int HygValueB = analogRead(A4);
  int HygValueC = analogRead(A5);

  EthernetClient client = server.available();
  if (client) {
    Serial.println("new client");
    boolean currentLineIsBlank = true;
    while (client.connected()) {
      if (client.available()) {
        char c = client.read();
        if (readString.length() < 135) readString += c;
        Serial.println(readString);
        if (c == '\n') {
          client.println("HTTP/1.1 200 OK");
          client.println("Content-Type:text/html");
          client.println("Connection: close");
          client.println();
          client.println("<!DOCTYPE HTML>");
          client.println("<html style=\"background-color:black;\">");
          client.println("<head><title>ArduinoSide</title>");
          client.println("<link rel=\"icon\" href=\"https://www.clker.com/cliparts/D/W/n/h/n/W/house-logo-hi.png\">");
          client.println("</head><body>");
          client.println("<form action=\"https://192.168.1.20/Arduinautomotioncommunication.php?\" method=\"get\" target=\"_blank\">");
          client.println("<input type=\"hidden\" name=\"temperatureCelsius\" >");
          client.println("value="); client.println(temperature); client.println(">");
          client.println("<input type=\"hidden\" name=\"temperatureFahrenheit\" >");
          client.println("value="); client.println(fahrenheit); client.println(">");
          client.println("<input type=\"hidden\" name=\"humidity\" >");
          client.println("value="); client.println(humidity); client.println(">");
          client.println("<input type=\"hidden\" name=\"flame\" >");
          client.println("value="); client.println(flameValue); client.println(">");
          client.println("<input type=\"hidden\" name=\"MQ4sensor\" >");
          client.println("value="); client.println(MQ4Value); client.println(">");
          client.println("<input type=\"hidden\" name=\"LDRsensor\" >");
          client.println("value="); client.println(ldrValue); client.println(">");
          client.println("<input type=\"hidden\" name=\"plant1H\" >");
          client.println("value="); client.println(HygValueA); client.println(">");
          client.println("<input type=\"hidden\" name=\"plant2H\" >");
          client.println("value="); client.println(HygValueB); client.println(">");
          client.println("<input type=\"hidden\" name=\"plant3H\" >");
          client.println("value="); client.println(HygValueC); client.println(">");
          client.println("<input type=\"submit\" value=\"Communication\" style=\"width:500px;height:200px;font-weight:bold;background-color:black;color:green;\">");
          client.println("</form></body></html>");
          break;
        }
      }
    }
    delay(1);
    client.stop();

    // 解析来自网站的指令控制继电器
    if (readString.indexOf("?airpump=pumpIsOn") > 0) digitalWrite(pump, LOW);
    else if (readString.indexOf("?airpump=pumpIsOff") > 0) digitalWrite(pump, HIGH);
    if (readString.indexOf("&lamp=lampIsOn") > 0) digitalWrite(lamp, LOW);
    else if (readString.indexOf("&lamp=lampIsOff") > 0) digitalWrite(lamp, HIGH);
    if (readString.indexOf("&feed=feedIsOn") > 0) digitalWrite(feed, LOW);
    else if (readString.indexOf("&feed=feedIsOff") > 0) digitalWrite(feed, HIGH);
    if (readString.indexOf("&heater=heaterIsOn") > 0) digitalWrite(heater, LOW);
    else if (readString.indexOf("&heater=heaterIsOff") > 0) digitalWrite(heater, HIGH);
    if (readString.indexOf("&filterex=exIsOn") > 0) digitalWrite(filterex, LOW);
    else if (readString.indexOf("&filterex=exIsOff") > 0) digitalWrite(filterex, HIGH);
    if (readString.indexOf("&filterin=inIsOn") > 0) digitalWrite(filterin, LOW);
    else if (readString.indexOf("&filterin=inIsOff") > 0) digitalWrite(filterin, HIGH);
    if (readString.indexOf("&irrigation=start") > 0) digitalWrite(irrigation, LOW);
    else if (readString.indexOf("&irrigation=stop") > 0) digitalWrite(irrigation, HIGH);

    readString = "";
    Serial.println("client disconnected");
  }
}

自定义部件与外壳

• arduinautomotion_wNJ69zA666.ico
• spidersense_Ge3umcKzBw.mp4
• spidermanvoice_EqWLILohmW.mp3

原理图