ESP8266 Community Forum

Posted: **Sat Feb 22, 2020 6:58 am**

I uploaded the attached sketch DisplaySerialOnWebpage from the Arduino IDE to the ESP8266 on a WeMos Uno+WiFi clone. Ultimately, I want the sketch to read text from the Uno on the board and display it on Safari, on an iMac, but to test the connection I ran the ESP8266 independently and sent and received serial data from/to the Arduino IDE monitor.

The ESP8266 connects to my local network router and Safari starts to connect to the ESP8266, but freezes before completing the connection and displaying the introductory message (ESP8266 here!). The ESP8266 continues to read from and echo to the Arduino monitor but nothing is displayed until I enter a line starting with 'x', closing the WiFi connection, at which point everything is displayed on Safari. The attached files Monitor.png and Safari.png show the completed input/output.

As you can see from the sketch, I have (successfully?) set the ESP8266 connection to no delay and automatic flush, as well as manually flushing the client after each transmission. What can I do, or what am I doing wrong, to force the immediate display of text on Safari as soon as each line of text is sent?

When I preview this message it says that the DisplaySerialOnWebpage.ino file is not downloaded yet. I don't know what to do about this, so I am submitting the message anyway. If the file doesn't transmit please tell me and I will try again to upload it.

Posted: **Sat Feb 22, 2020 12:44 pm**

I have tried again to upload the ESP8266 sketch file, but it still says that the file is not downloaded, so I have copied and pasted it here:

Code: Select all

#include <SPI.h>
#include <ESP8266WiFi.h>

#define sensorPin A0

char ssid[] = "TALKTALK1283E0";
char pass[] = "UE49NH86";
int keyIndex = 0;

int status = WL_IDLE_STATUS;
WiFiServer server(80);

int highTemp = 82;
int goodTemp = 76;
float temperatureF; // need to make this global

void setup() {
  Serial.begin(115200);

  while (status != WL_CONNECTED) {
    Serial.print("Attempting to connect to Network named: ");
    Serial.println(ssid);
    status = WiFi.begin(ssid, pass);
    delay(10000);
  }
  server.begin();

  Serial.print("SSID: ");
  Serial.println(WiFi.SSID());
  IPAddress ip = WiFi.localIP();
  Serial.print("IP Address: ");
  Serial.println(ip);
}

void loop() {
  WiFiClient client = server.available();   
  if (client) {                             
    Serial.println("new client");
    client.setNoDelay(true); 
    delay(1000);
    if (client.getNoDelay())
      Serial.println("No Delay set"); 
    client.setSync(true);
    if (client.getSync())
      Serial.println("Sync set");      
    String currentLine = "";                
    while (client.connected()) {            
      if (client.available()) {             
        char c = client.read();             
        Serial.write(c);                    
        if (c == '\n') {                    
          if (currentLine.length() == 0) {
            client.println("<head><title>ESP8266</title></head>");
            client.println("ESP8266 here!<br>");
            client.flush();
            // Read from serial line
            while (true) {
              while (Serial.available() == 0)
                delay(1000);
              currentLine = "";
              while (Serial.available() > 0) {
                c = Serial.read();
                Serial.write(c);
                currentLine += c;
              }
              if (currentLine[0] == 'x') {
                client.stop();
                Serial.println("client disconnected");
                delay(10000);
              }
              client.println(currentLine + "<br>");
              client.flush();
            }
            break;           
          } else {
            currentLine = "";
          }      
        } else if (c != '\r') {
          currentLine += c;
        }
      }
    }
  }
}

Posted: **Sat Feb 22, 2020 12:54 pm**

there is no DisplaySerialOnWebpage example for esp8266 arduino.
for what library is the example?

you send the response before the request is read. browsers don't like to receive a response before they finished to send the request. client.find("\r\n\r\n"); is a simplest way to wait for the complete http request.

Posted: **Sat Feb 22, 2020 5:01 pm**

Thanks for the reply JuraJ.
I have posted the DisplaySerialOnWebpage, so you can see that I am using the SPI.h and ESP8266WiFi.h libraries.
My problem is that I have no idea what goes on when Safari connects to the ESP8266 client so I just based my code on this example - https://www.elithecomputerguy.com/2019/ ... age-alert/ - removing the bit about the temperature and the request to refresh the page. I am not quite sure how to follow your advice, so I tried a simplified version of my code with your suggestion (see below) but still nothing appears on Safari until the client.stop() is executed.

Could you give me a correct version of the simplified code please?

Code: Select all

#include <SPI.h>
#include <ESP8266WiFi.h>

char ssid[] = "TALKTALK1283E0";
char pass[] = "UE49NH86";
int status = WL_IDLE_STATUS;
WiFiServer server(80);

void setup() {
  Serial.begin(115200);
  while (status != WL_CONNECTED) {
    Serial.print("Attempting to connect to Network named: ");
    Serial.println(ssid);
    status = WiFi.begin(ssid, pass);
    delay(10000);
  }
  server.begin();
  Serial.print("SSID: ");
  Serial.println(WiFi.SSID());
  IPAddress ip = WiFi.localIP();
  Serial.print("IP Address: ");
  Serial.println(ip);
}

void loop() {
  WiFiClient client = server.available();   
  if (client) {                             
    Serial.println("New client");
    client.setNoDelay(true); 
    delay(1000);
    if (client.getNoDelay())
      Serial.println("No Delay set"); 
    client.setSync(true);
    if (client.getSync())
      Serial.println("Sync set");      
    String currentLine = "";                
    while (client.connected()) {            
      if (client.available()) {  
        client.find("\r\n\r\n");
        Serial.println("Found client response");          
        client.println("<head><title>Display Serial Data on Webpage</title></head>");
        client.find("\r\n\r\n");
        Serial.println("Found 2nd client response");          
        client.println("ESP8266 here!<br>");
        delay(30000);
        client.stop();
      }
    }
  }
}

ESP8266 Community Forum

Problem displaying text on web page

Problem displaying text on web page

Re: Problem displaying text on web page

Re: Problem displaying text on web page

Re: Problem displaying text on web page