Web interface from NodeMCU – Part 1, Basic interface

WiFiNewLibrary.h

#ifndef WiFiNewLibrary_h
#define WiFiNewLibrary_h

#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <memory>

extern "C" {
	#include "user_interface.h"
}

const char HTTP_HEADER[] PROGMEM = "<!DOCTYPE html><html lang=\"en\"><head><meta charset=\"UTF-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1, user-scalable=no\"/><title>{v}</title>";
const char HTTP_STYLE[] PROGMEM = "<style>.c{text-align: center;} div,input{padding:5px;font-size:1em;} input{width:95%;} body{text-align: center;font-family:verdana;} button{border:0;background-color: #58d68d;color:#fff;line-height:2.4rem;font-size:1.2rem;width:100%;} .q{float: right;width: 64px;text-align: right;} </style>";
const char HTTP_HEADER_END[] PROGMEM = "</head><body><div style='text-align:left;display:inline-block;min-width:260px;'>";
const char HTTP_PORTAL_OPTIONS[] PROGMEM = "<form action=\"/wifi\" method=\"get\"><button>Configure WiFi</button></form><br/><form action=\"/i\" method=\"get\"><button>ESP8266 Info</button></form><br/><form action=\"/r\" method=\"post\"><button>Reset ESP8266</button></form>";
const char HTTP_END[] PROGMEM = "</div></body></html>";

class WiFiNewLibrary
{
	private:
		std::unique_ptr<ESP8266WebServer> server; 

		const char* _customHeadElement	= "";
		const char* _apName = "ESPaccessPoint";
		const char* _apPassword = "123456789";

	public:
		WiFiNewLibrary();
		void setupConfigPortal();
		void handleRoot();
};

#endif

WiFiNewLibrary.cpp

#include "WiFiNewLibrary.h"

WiFiNewLibrary::WiFiNewLibrary()
{
	
}

void WiFiNewLibrary::setupConfigPortal()
{
	server.reset(new ESP8266WebServer(80));

	if(_apPassword != NULL)
	{
		if(strlen(_apPassword) < 8 || strlen(_apPassword) > 63)
		{
			Serial.println("Invalid password...");
			_apPassword = NULL;	
		}	
	}

	if(_apPassword != NULL)
	{
		WiFi.softAP(_apName, _apPassword);
	}
	else
	{	
		WiFi.softAP(_apName);	
	}

	Serial.println("AP IP Address");
	Serial.println(WiFi.softAPIP());

	server -> on(String(F("/")).c_str(), std::bind(&WiFiNewLibrary::handleRoot, this));
	server -> begin();

	while(1)
	{
		server -> handleClient();
	}
}

void WiFiNewLibrary::handleRoot()
{
	String page = FPSTR(HTTP_HEADER);
	page.replace("{v}", "Options");
	page += FPSTR(HTTP_STYLE);
	page += _customHeadElement;
	page += FPSTR(HTTP_HEADER_END);
	page += String(F("<h1>"));
	page += _apName;
	page += String(F("</h1>"));
	page += FPSTR(HTTP_PORTAL_OPTIONS);
	page += FPSTR(HTTP_END);

	server -> sendHeader("Content-Length", String(page.length()));
	server -> send(200, "text/html", page);		
}

keywords.txt

WiFiNewLibrary		keyword1

ArduinoProgram.ino

#include <WiFiNewLibrary.h>

WiFiNewLibrary wifiNewLibrary;

void setup() {
  Serial.begin(115200);
  // put your setup code here, to run once:
  wifiNewLibrary.setupConfigPortal();
}

void loop() {
  // put your main code here, to run repeatedly:

}

After uploading the program, connect your Android device to NodeMCU through WiFi. Open 192.168.4.1 in the web browser to get the web interface.

Published by

Leave a Reply

X