Project

General

Profile

HTTP Web Server stucks on loading index.html webpage

Added by martin van beek 4 months ago

I have problems with the configuration of the HTTP Server.
When using the GET block, you must enter the number of needed requests of the URI handler.
In my case there are 8 requests when opening the start index.html page:

/index.html
/assets/bootstrap/css/bootstrap.min.css
/assets/js/jquery.min.js
/assets/fonts/font-awesome.min.css
/assets/bootstrap/js/bootstrap.min.js
/assets/js/script.min.js
/assets/img/downloads-bg.jpg
/assets/img/intro-bg.jpg

The HTTP Server GET block is configured as below:

URI: /
Number of requests: 8

Request1
/
.html
sdcard
/D/index.html

Request2
/bootstrap.min.css
.css
sdcard
/D/assets/bootstrap/css

Request3
/jquery.min.js
.js
sdcard
/D/assets/js

Request4
/font-awesome.min.css
.css
sdcard
/D/assets/fonts

Request5
/bootstrap.min.js
.js
sdcard
/D/assets/bootstrap/js

Request6
/script.min.js
.js
sdcard
/D/assets/js

Request7
/downloads-bg.png
.png
sdcard
/D/assets/img

Request8
/intro-bg.png
.png
sdcard
/D/assets/img

When finally enters the 'Apply' and 'OK' button of this HTTP Server GET block, you never can change a single input field.
When trying to change a single setting, for instance request #3, and open up the GET block, you will see only 1 entry, instead of all 8 requests.
This is very annoying, the only solution is to place an empty GET block and do the configuration over again.

When everything is configured correct and uploaded to the ESP32 device, you can check the result with any html browser.
In my case the index.html page is loading forever and never throws an error.
When interrupting this loading process after a while, you will see the text of the intended webpage, but the background images and style sheets are missing!
The ESP32 debug port shows only the intended URI request and no error or warning is shown.
How can I solve this problem, are there some limitations, e.g. the maximum allowed opened files on the SD card etc.

Do Aimagin have additional information and examples about this topic.
Thanks for your reply, best regards,

Martin.


Replies (6)

RE: HTTP Web Server stucks on loading index.html webpage - Added by Chandima Jayaneththi (จันทิมา) 4 months ago

Thank you for reaching us.
If you carefully look in to the Developer Tools in Chrome browser, it shows that the requested files are not served from the esp32 server except the html file.

It can be confirmed using the log data from the serial monitor.

If a file is successfully served, it will show that the headers are set and the response data is sent for the corresponding request. In this scenario, it shows only for the first request.

One of the reasons for this problem will be the incorrect file path or file is assigned to an incorrect request. In the attached simulink model, there are two issues in the get handler block configuration. First, the given request from request #2 and onwards are partial requests but " Compare whole request " option is checked. If this option is checked you have to state the full request. As an example, for the request #2, if the above option is checked, the comparing request should be "/assets/bootstrap/css/bootstrap.min.css". Otherwise above option should be unchecked.

Second is the file location. For this, the full file path is required not the folder path.
If you configure the get handler block as below from request #2 to 8, you can fix those problems.

We will add useful log messages for the http server block and fix the block mask appearance issue in future releases.
Please let us know if the problem still persists.

RE: HTTP Web Server stucks on loading index.html webpage - Added by martin van beek 4 months ago

Thanks for your reply.
I started over again with an empty http get handler and leave the "compare whole request" unchecked.
When compiling and downloading the code into the esp32 module, the serial debug port shows up new error messages, namely 'unexpected token' when loading the index.html page.
You can also see that all header types are (re)set to 'html' for all different files, like bootstrap.min.js, jquery.min.js...

Is there any workaround possible to get the web page running as intended, including the background images.

Best regards,

Martin.

RE: HTTP Web Server stucks on loading index.html webpage - Added by Chandima Jayaneththi (จันทิมา) 4 months ago

Hello Martin,

As a solution for this issue, please check " Compare whole request " for the request #1 because it is a complete request and from request #2 to 8 uncheck the "compare whole request". And check " Enable wildcard for this handler " , otherwise it will be required 8 get request handler blocks to handle the 8 requests.

I have attached the patch file for bugfix of the the block mask appearance issue. please replace the following patch file, esp32_http_server_callback.p at the location: " ...[ your path to waijung2 installation directory ]\waijung2_20.11b\waijung2\targets\esp32\src\blocks "

RE: HTTP Web Server stucks on loading index.html webpage - Added by martin van beek 4 months ago

Thanks a lot,
This quick fix solves most of the annoying problems.
Now it's possible to open and edit the http get block, that saves a lot of retyping all needed data ;0))

But there is still a small bug.
When opening the index.html page that is running on the esp32, that loading process will never ends, it is trying to load the webpage forever.
When opening the same index.html page, directly from the SD card then loading will end after a few seconds and everything is working as intended.
How can I solve this 'forever loading' behavior.

RE: HTTP Web Server stucks on loading index.html webpage - Added by Chandima Jayaneththi (จันทิมา) 4 months ago

The quick solution for this issue is to add a new request to the get request handler block. If you check in the Developer Tools in Chrome browser, it shows that there is a pending file in the client. That's the reason why the web page shows that it still loading.

If you add a new request as below, you can fix that issue.

RE: HTTP Web Server stucks on loading index.html webpage - Added by martin van beek 4 months ago

Hi Chandima,
Thanks for your additional information.
After adding the "pending" file requests will result in an error free webpage finally.
This is a very clumsy http web server setup interface, comparing with the Waijung 1 blockset (stm32f4).
Waijung 1 blockset only needs a http webserver object and the complete webpage is displayed at the glance.

What if the http server get block needs more than 12 requests, can you combine more blocks to overcome this limitation?
Best regards,

Martin.

    (1-6/6)