Teensy 3.2 + ESP-01 and using AJAX to update a page--stuck

KrisKasprzak · Jul 27, 2020

OK gang,

I'm close to having a Teensy 3.2 connected to a cheap ESP-01 Wifi module working where the code uses AJAX to update specific data on the web page. I actually have all this working with and ESP-8266, but i really want to use the Teensy with this esp module--long story.

Lib i'm using https://github.com/bportaluri/WiFiEsp

My code is below and here's what is working
1. creates an AP
2. I can connect to the IP address 168.194.4.1
3. code creates a web page and sends to Chrome browser
4. code receives "PUT" keyword and sends back and XML--all with no warnings

however the java scrip is not updating the web page

One thing I noticed is that after client.write(...) the IPD returned is not the same as the IP address initially connected to.

it returns this to the Serial monitor
+IPD,1,347,192.168.4.2,53696

UT

Notice the difference in the IP address..

I know this is a long shot, but it's very possible the lib i'm using isn't capable of running AJAX scenario.

Code:

#include "WiFiEsp.h"

char ssid[] = "PATRIOT_RACING";         // your network SSID (name)
char pass[] = "1223334444";        // your network password
int status = WL_IDLE_STATUS;     // the Wifi radio's status
int reqCount = 0;                // number of requests received

char XML[500];
char buf[100];
int inc = 0;

const char PAGE[] PROGMEM = R"=====(

  <!DOCTYPE html>
  <html lang="en" class="js-focus-visible">
    <style>
      .dd {
      font-family: "Verdana", "Arial", sans-serif;
      font-size: 80px;
      color: #AAAAAA;
      }
    </style>
   <body style="background-color: #efefef" onload="process()">
     
      <div class="dd" id="xxx">is the count</div>
  
      <script>
      
        var xmlHttp=createXmlHttpObject();

        function createXmlHttpObject(){
          if(window.XMLHttpRequest){
            xmlHttp=new XMLHttpRequest();
          }
          else{
            xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
          return xmlHttp;
        }
    
        function response() {
  
          var message;
          var xmlResponse;
          var xmldoc;
     
            
          xmlResponse=xmlHttp.responseXML;
          xmldoc = xmlResponse.getElementsByTagName("D1");
          message = xmldoc[0].firstChild.nodeValue;
          document.getElementsByClassName("dd")[0].innerHTML=message;
        }
      
        function process()  {
          xmlHttp.open("PUT","xml",true);
          xmlHttp.onreadystatechange=response;
          xmlHttp.send(null);
          setTimeout("process()",800);
        }
  
      </script>
    </body>
  </html>

)=====";

WiFiEspServer server(80);
RingBuffer RingBuf(16);

void setup() {

  pinMode(2, OUTPUT); // EN

  delay(100);

  digitalWrite(2, HIGH);

  Serial.begin(115200);   // initialize serial for debugging
  Serial1.begin(115200);    // initialize serial for ESP module
  WiFi.init(&Serial1);    // initialize ESP module

  if (WiFi.status() == WL_NO_SHIELD) {
    Serial.println("WiFi shield not present");
    while (true); // don't continue
  }

  Serial.print("Attempting to start AP ");
  Serial.println(ssid);

  status = WiFi.beginAP(ssid,10); //, ENC_TYPE_WPA2_PSK);

  Serial.println("Access point started");
  printWifiStatus();

  // start the web server on port 80
  server.begin();
  Serial.println("Server started");
  
}


void loop() {

  inc = inc + 1;

  delay(500);
  
  WiFiEspClient client = server.available();  // listen for incoming clients

  if (client) {                               // if you get a client,
    Serial.println("New client");             // print a message out the serial port
    RingBuf.init();                               // initialize the circular buffer
    while (client.connected()) {              // loop while the client's connected
      if (client.available()) {               // if there's bytes to read from the client,

        char c = client.read();               // read a byte, then

        Serial.print(c);

        RingBuf.push(c);

        if (RingBuf.endsWith("PUT")) {
          Serial.println("sending xml");
          XMLcontent(client);
          Serial.println("sent xml");
          delay(100);
          break;
        }
        
        if (RingBuf.endsWith("GET")) {
          Serial.println("sending main page");
          client.write(PAGE, sizeof(PAGE));
          Serial.println("sent main page");
          delay(100);
          break;
        }
      }
    }

    // give the web browser time to receive the data
    delay(30);

    // close the connection
    client.stop();
    Serial.println("Client disconnected");
  }
}

void printWifiStatus()
{
  // print your WiFi shield's IP address
  IPAddress ip = WiFi.localIP();
  Serial.print("IP Address: ");
  Serial.println(ip);

  // print where to go in the browser
  Serial.println();
  Serial.print("To see this page in action, connect to ");
  Serial.print(ssid);
  Serial.print(" and open a browser to http://");
  Serial.println(ip);
  Serial.println();
}


void XMLcontent(WiFiEspClient client) {

  strcpy(XML, "<?xml version='1.0'?>\n<Data>\n");
  sprintf(buf, "<D1>%d</D1>\n", inc);
  strcat(XML, buf);
  strcat(XML, "</Data>\n");
  client.write(XML, sizeof(XML));
  delay(130);
}

Teensy 3.2 + ESP-01 and using AJAX to update a page--stuck

KrisKasprzak

Well-known member