Skip to content

HTML head elements don't appear to be working when sending page using SPIFFS, but they work with PROGMEM #2926

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
GeorgeFlorian opened this issue Jun 24, 2019 · 0 comments
Closed

HTML head elements don't appear to be working when sending page using SPIFFS, but they work with PROGMEM #2926

GeorgeFlorian opened this issue Jun 24, 2019 · 0 comments

Comments

@GeorgeFlorian
Copy link

Hello !

I am running ESPAsyncWebServer on an ESP32 DevKitV4 Wrover-B.

I've tested today a way of sending web-pages with PROGMEM and I've noticed something strange. When sending the same page with SPIFFS, I couldn't get <meta name="theme-color" content="#e11422"> to work.
But now, when I've send the same page with PROGMEM <meta name="theme-color" content="#e11422"> started working.

I've only tested with a mobile phone, because I couldn't get my PC to connect to the ESP32 (#2910) so I can't tell if any of the head elements work with SPIFFS. But I am starting to think that they don't.

This is the unminified HTML's head that I send using SPIFFS system.

<head>
    <meta charset = "utf-8">
    <meta name = "viewport" content = "width=device-width, initial-scale=1.0">
    <!-- Chrome, Firefox OS and Opera -->
    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
    <link rel="shortcut icon" href="/favicon.ico">
    <!-- Tab Color iOS Safari -->
    <meta name="apple-mobile-web-app-title" content="#e11422">
    <meta name="application-name" content="#e11422">
    <!-- Tab Color Android Chrome -->
    <meta name="theme-color" content="#e11422">

    <link rel = "stylesheet" type = "text/css" href = "master.css">  
    <title>DHCP IP</title>
       
</head>

This is the Server's handler:

  server.on("/IP-config", HTTP_GET, [](AsyncWebServerRequest* request){
    request->send(SPIFFS, "/AP_configPage.html", "text/html");
  });

Now I put the HTML's head through a minifier and a C/C++ string converter and the Server's handler transforms into this:

  server.on("/IP-Config", HTTP_GET, [](AsyncWebServerRequest *request){

    const char index_html[] PROGMEM = "<!DOCTYPE html><html> <head> <meta charset=\"utf-8\"> <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"> <link rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/favicon-32x32.png\"> <link rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/favicon-16x16.png\"> <link rel=\"shortcut icon\" href=\"/favicon.ico\"> <meta name=\"apple-mobile-web-app-title\" content=\"#e11422\"> <meta name=\"application-name\" content=\"#e11422\"> <meta name=\"theme-color\" content=\"#e11422\"> <link rel=\"stylesheet\" type=\"text/css\" href=\"master.css\"> <title>IP Config</title> </head> <body> <div class=\"centered-box\"> <div class=\"box-head\"> <div class=\"logo\"><img url=\"logo.png\"></div><div class=\"title\"><h1>Setup - Network</h1></div></div><form method=\"post\" action=\"/dhcpIP\"> <input class=\" button\" type=\"submit\" name=\"dhcp\" value=\"DHCP IP\" title=\"Redirect to DHCP IP Config page\"> <input class=\" button\" type=\"submit\" name=\"static\" value=\"Static IP\" title=\"Redirect to Static IP Config page\" formaction=\"/staticIP\"> </form> </div></body> </html>";

    request->send_P(200, "text/html", index_html);
  });

The question is: why does it work properly when it's send with PROGMEM but it doesn't work properly when it's send using SPIFFS ?

The head tag doesn't appear to change.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@GeorgeFlorian