我最近购买了一个 ESP8266,并开始使用它。我做了一个网站,它有三个按钮来控制板上的 3 个 LED。该站点使用 XML AJAX 和 JavaScript 与 ESP 进行通信。老实说,我对自己在做什么一无所知。 ESP 成功连接到我的 WiFi 并为网站提供服务,但出于某种我不知道的原因,ESP 不提供 XML 文件。
如果发错地方了,我深表歉意
ESP代码:
#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include "page.h"
//LED Pin defenition.
const int led1 = 14;
const int led2 = 12;
const int led3 = 13;
#define SSID "Orlando"
#define PASS "orlando123"
#define AP_SSID "ESP2866"
#define AP_PASS "password"
bool led11 = false;
bool led22 = false;
bool led33 = false;
char XML[1024];
IPAddress Actual_IP;
//Start a server at port 80.
ESP8266WebServer server(80);
void setup() {
pinMode(led1, OUTPUT);
pinMode(led2, OUTPUT);
pinMode(led3, OUTPUT);
Serial.begin(9600);
for (int i = 12;i < 15;i++){
digitalWrite(i, LOW);
}
//Initliaizes WIFI
WiFi.begin(SSID, PASS);
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
Serial.print("IP address: "); Serial.println(WiFi.localIP());
Actual_IP = WiFi.localIP();
server.on("/", sendWebsite);
server.on("/xml", SendXML);
//If the ESP recieves the "BUTTON_1" string, it will run the ProcessButton_1 method.
server.on("/BUTTON_1", ProcessButton_1);
server.on("/BUTTON_2", ProcessButton_2);
server.on("/BUTTON_3", ProcessButton_3);
server.begin();
}
void loop() {
server.handleClient();
}
//Method for sending the site.
void sendWebsite() {
server.send(200, "text/html", WEBSITE);
Serial.println("Sending website.");
}
//Method for sendind the XML info.
void SendXML() {
Serial.println("sending xml");
strcpy(XML, "<?xml version = '1.0'?>\n<Data>\n");
if (led1) {
strcat(XML, "<LED1>1</LED1>\n");
}
else {
strcat(XML, "<LED1>0</LED1>\n");
}
if (led2) {
strcat(XML, "<LED2>1</LED2>\n");
}
else {
strcat(XML, "<LED2>0</LED2>\n");
}
if (led3) {
strcat(XML, "<LED3>1</LED3>\n");
}
else {
strcat(XML, "<LED3>0</LED3>\n");
}
strcat(XML, "</Data>\n");
server.send(200, "text/xml", XML);
Serial.println("Sending XML");
Serial.println(XML);
}
void ProcessButton_1() {
led11 != led11;
digitalWrite(led1, led11);
server.send(200, "text/plain", "");
Serial.println("Processing button1");
}
void ProcessButton_2() {
led22 != led22;
digitalWrite(led2, led22);
server.send(200, "text/plain", "");
Serial.println("Processing button2");
}
void ProcessButton_3() {
led33 != led33;
digitalWrite(led3, led33);
server.send(200, "text/plain", "");
Serial.println("Processing button3");
}
网站代码:
<!DOCTYPE html>
<html lang="en" class="js-focus-visible">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Webserver</title>
</head>
<body onload="process()">
<div class="container">
<div class="header">
<h1>Panel</h1>
<br>
</div>
<div class="controls">
<table>
<tr>
<th>
<p>BLUE LED</p>
<button type="button" class="button1" id="sw1" onclick="ButtonPress1()">
ON/OFF
</button>
</th>
<th>
<p>RED LED</p>
<button type="button" class="button2" id="sw2" onclick="ButtonPress2()">
ON/OFF
</button>
</th>
<th>
<p>GREEN LED</p>
<!--ButtonPress3() - calls to a javascript function-->
<button type="button" class="button3" id="sw3" onclick="ButtonPress3()">
ON/OFF
</button>
</th>
</tr>
</table>
</div>
</div>
</body>
<script type = "text/javascript">
// Creates XmlHttpObject
var xmlHttp=createXmlHttpObject();
function createXmlHttpObject(){
if(window.XMLHttpRequest){
xmlHttp=new XMLHttpRequest();
}
else{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
return xmlHttp;
}
//All the functions are for the correspoding button on the website:
function ButtonPress1() {
var xhttp = new XMLHttpRequest();
var message;
//Opens a request, specifies type of request, data to send
//in this case a string: "BUTTON_1", and if request is synchrounous.
xhttp.open("PUT", "BUTTON_1", false);
xhttp.send();
}
function ButtonPress2() {
var xhttp = new XMLHttpRequest();
var message2;
//Opens a request, specifies type of request, data to send
//in this case a string: "BUTTON_2", and if request is synchrounous.
xhttp.open("PUT", "BUTTON_2", false);
xhttp.send();
}
function ButtonPress3() {
var xhttp = new XMLHttpRequest();
var message3;
//Opens a request, specifies type of request, data to send
//in this case a string: "BUTTON_3", and if request is synchrounous.
//xttp.open sends a string, in this case "BUTTON_3", this signals the
//ESP, that a button has been pressed.
xhttp.open("PUT", "BUTTON_3", false);
xhttp.send();
}
function ESP_response() {
var message1;
var message2;
var message3;
var xmlResponse;
//Read the XML stream.
xmlResponse=xmlHttp.responseXML;
if(message1 == 0 ) {
document.getElementById("sw1").innerHTML="OFF";
}
else {
document.getElementById("sw1").innterHTML="ON";
}
if(message2 == 0 ) {
document.getElementById("sw2").innerHTML="OFF";
}
else {
document.getElementById("sw2").innterHTML="ON";
}
if(message3 == 0 ) {
document.getElementById("sw3").innerHTML="OFF";
}
else {
document.getElementById("sw3").innterHTML="ON";
}
}
function process(){
if(xmlHttp.readyState==0 || xmlHttp.readyState==4) {
xmlHttp.open("PUT","xml",true);
xmlHttp.onreadystatechange=response;
xmlHttp.send(null);
}
setTimeout("process()",200);
}
</script>
</html>
提前致谢。
我希望 ESP 响应网站上的按钮按下。 我没有尝试过任何东西,因为我没有任何经验可以帮助我。