WiFiEsp library - HTML with embedded src = calls

[JaBa]

Hello, I've been working this for two weeks and researched so much that I need new glasses.

I have a 20MHz 1284 based Arduino with an ESP-01 module as a WiFi shield using the WiFiEsp library.

I want to be able to see the current status and log records as well as be able to configure the project via HTML.

The main web page contains, several iframes such as:

and also a <script src="confg.js""></script.js>

For now, each of those "src" is a separate file on the SD. Later, they will not be a file on the SD but will be generated dynamically, for instance to show the current status. (And will probably be sent using chunked encoding).

If I click on the main htm file on the SD from my laptop, everything loads as I expect. Even the script fires. The SD contains a favicon.ico and it also loads.

However, when using the Arduino as a server, the iframes do not load. Ever. The main page loads, the script loads (last src reference in the main html), but not the iframes.

Here is what I think I have learned. When using the ESP-01 as a shield, it only supports one socket for use as a server so there can only be one client at a time active. Parallel requests therefore cannot be supported.

Sending of a file takes a couple of seconds and maybe the Arduino isn't fast enough to process multiple requests one after the other.

Most example webserver sketches send one file and close the connection. The HTTP response states "Connection: close". Using this scheme, I truly seem to only receive the request for the main file and no others.

I have changed the Arduino server to use "Connection: Keep-Alive" and "Keep-Alive: max=6, timeout=60". While sending any given file, I also poll for client.available and can actually capture and respond to the request for the confg.js script. It fires on the webpage so I know that part is working. (Everything on the one client connection which is only closed after inactivity for two minutes.)

The main html takes about 3 seconds to send, the script only about 1.5 seconds (SD overhead included).

The problem is, nothing I do seems to cause the Arduino server to actually receive a request from the browser for any of the iframes!

What I don't know: Is my browser (mainly Microsoft EdgeVersion 87.0.664.75 but I have also tried others) attempting to load the iframes with parallel connections? How can the server prevent parallel connections and force everything onto the one persistent connection?

All responses from the server (main html, iframes and script) are in the form:

HTTP/1.1 200 OK\r\n
Content-Type: text/html\r\n
Content-Length: 3800\r\n
Connection: Keep-Alive\r\n
Keep-Alive: max=6, timeout=60\r\n
\r\n

(And yes, script is type: text/javascript)

Do I have to associate the individual iframe responses to the name requested? Would make sense to say, you ask for status.htm and here it is. On the other hand, the confg.js works fine and isn't named?

Do I have to put something in my response headers so the browser knows not to use parallel connections?

I swear, if I ever get this figured out, I'm going to write a 400 page tutorial and post it online somewhere. Grrr....

Thanks for any tips anyone may have!

[Juraj]

the AT firmware server can have 5 clients in parallel.

put static files in SD card and serve them from it without change. use AJAX technique to request data and show them on the page.

this project GitHub - JAndrassy/IsgModbusTcpSG: DIY "SG Ready" adapter for Stiebel Eltron ISGweb. This Arduino sketch reads the state of digital input input pin of Arduino and sets the state over Modbus TCP to SG Ready INPUT1 register of ISGweb. It has overdeveloped monitoring and control. uses Ethernet but it is simple to port its WebServer to WiFiEsp library.

[JaBa]

Thanks Juraj, I read your comment yesterday. Because of you, I couldn't sleep.

However, with the info you provided, I think I figured out where I went wrong. The WiFiEsp library had a comment about only allowing one socket for server and I confused that with only allowing one connection. Wondered then why "available" was being used if there is only one available but didn't follow it through enough.

Also, I quite obviously misunderstood the word "client". I was considering a client to be something like a SESSION from a browser. Now, I hope I got it right that in this respect "client" is more like a single request from a browser session and that there may be many "clients" involved to show a single web page (like in my case).

Also, you pointed out that the AT Firmware supported 5 clients... I counted again and bingo. I was receiving the initial request, ignoring request 2, 3, 4, and 5 because they were on other "clients" (and me believing that a browser session was a client and therefore going down the wrong path). Anyway, I was also receiving the sixth request (the javascript) because the browser (or AT firmware) ran out of "clients" and the sixth request came in exactly the same way as the first.

I looked at the library you suggested and it seems to work just like all other samples I saw thus far. My entire problem was confusing "client" with browser session. I think now I can get it to work.

So now I know, handle each "client" as a single request, get it out to the browser as fast as you can, close it and move on. I still need to see how the buffering works as each request is several hundred bytes and obviously my Arduino Serial can't hold even one entire request. If the ESP isn't doing the buffering, while sending one file, I will need to poll for additional client requests coming in instead of what I was trying (polling for additional requests on the same client).

Thanks.

And, again, I swear if I ever get this working I am going to write a 400 page tutorial so no newbie like me (at least with WiFI) ever has to torture themselves again like I have these last couple of weeks!