Hi.
 
That project doesn’t work in access point mode, because it uses jquery and tries to load it from the web. See this line:

"<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>"

 
To make it work, you need to include the content of jquery in a separated file in the ESP board: https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js
 
And then, load it to include it into the serverIndex variable.
 
Let me know if this is clear.
Regards,
Sara

Hi Sara,
Thanks for the link, I have uploaded the jquery.min.js to SPIFFS and updated the server index variable from

“<script src=’https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js’></script>&#8221;
to

“<script src=’/jquery.min.js’></script>”
 

However still no success. I suspect the server has to load the file from SPIFFS, however I cannot work out the process, any guidance would be appreciated!

Hi.
I’m not sure how to serve files from SPIFFS using the WebServer.h library, which is the library used in that example.
I think you need to add something to handle the request for the file like this:

server.on("/jquery.min.js", HTTP_GET, []() {
  server.sendHeader("Connection", "close");
  server.send(200, "text/html", jquery.c_str());
});

In which jquery is a variable that holds the content of the file.
To read the content of a file from SPIFFS, you can use the following function:

// Read File from SPIFFS
String readFile(fs::FS &fs, const char * path){
  Serial.printf("Reading file: %s\r\n", path);

  File file = fs.open(path);
  if(!file || file.isDirectory()){
    Serial.println("- failed to open file for reading");
    return String();
  }

  String fileContent;
  while(file.available()){
  fileContent = file.readStringUntil('\n');
  break;
  }
  return fileContent;
}

So, the jquery variable would be something as follows:

String jquery = readFile(SPIFFS, "/PATH_FOR_THE_FILE_UPLOADED_TO_SPIFFS");

Of course, you also need to include and call a function to initialize SPIFFS like this:

/ Initialize SPIFFS

void initSPIFFS() {
  if (!SPIFFS.begin(true)) {
    Serial.println("An error has occurred while mounting SPIFFS");
  }
  Serial.println("SPIFFS mounted successfully");
}

I haven’t tested this. But, I think you need to follow something as described.
Let me know if this helps.
Regards,
Sara

Hey Sara,
We are getting close to making this work! I can now load the file from SPIFFS and send it to the webpage (when requested), however only one line of the JS file loaded. On looking at it I noticed the ‘\n’ during the file read (hence only seeing one line!). I changed that to EOF however there is now the issue of the 4kb String limitation on ESP32 which prevents any of the JS file loading.
Any thoughts on a workaround?

Hi.
I’m not sure how to solve that. Probably you’ll need to split the variable in several strings? But, I’m not sure if that is feasible or if SPIFFS can store all the content of that variable.
Does it show all the content in the serial monitor? If it is able to store everything on SPIFFS, the only way I can think of is to send the variable in several chunks.
I’m sorry that I can’t help much. Do you have any other suggestions?
Regards,
Sara

Hi Sara,
I have tested SPIFFs and it can carry the JS file size ok, so the issue is only with String (being limited to 4k). I will see if I can come up with a way to read out line by line and feed the javascript to the webpage (in chunks as you mentioned).  Reading the JS line by line from SPIFFS is easy enough, its feeding it to the backend of the webpage (something I am not yet familiar with!) and will need to look more closely at that and its associated library.
Thanks for all the help so far!
Darren
 
 

Ok Darren.
What about saving the variable using PROGRMEM? https://www.arduino.cc/reference/en/language/variables/utilities/progmem/
Meanwhile, if you find a solution, please share.
Regards,
Sara