ESP8266 网络服务器无法使用 AJAX 正确通信

问题描述 投票:0回答:0

我最近购买了一个 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 响应网站上的按钮按下。 我没有尝试过任何东西,因为我没有任何经验可以帮助我。

c++ ajax xml arduino-esp8266
© www.soinside.com 2019 - 2024. All rights reserved.