Skip to main content

Web server

Što ovaj primjer prikazuje​

Inkplate postaje mali samostalni web poslužitelj. Pokreće vlastitu Wi-Fi mrežu (pristupnu točku) pod nazivom Inkplate 7SPECTRA sa zaporkom Soldered te na zaslonu prikazuje kako se na nju spojiti. Pridružite se toj mreži putem mobitela ili računala, otvorite adresu prikazanu na zaslonu, upišite neki tekst u okvir na web stranici i pritisnite tipku. Tekst se prikazuje na zaslonu.

Naziv mreže i zaporku možete promijeniti izmjenom definicija ssid i pass. Skica ima drugu datoteku, htmlCode.h, koja sadrži web stranicu kao tekstni niz naziva s; držite je u mapi skice pored datoteke .ino.

Ovaj primjer također koristi WiFi, WiFiClient i WebServer (arduino-esp32), koji nisu dio Inkplate biblioteke i dolaze s paketom pločice za ESP32.

Primjer koda​

Select Board
Inkplate7SPECTRA_HTTP_Web_Server.ino
#include "Inkplate.h"   //Include Inkplate library to the sketch
#include "htmlCode.h"   //Include .h file where we stored out html code of our web page
#include <WebServer.h>  //Include ESP32 library for Web server
#include <WiFi.h>       //Include ESP32 WiFi library
#include <WiFiClient.h> //Include ESP32 WiFi library for AP
#include <uri/UriBraces.h>

#define ssid "Inkplate 7SPECTRA"
#define pass "Soldered"

Inkplate inkplate;      // Create an object on Inkplate library and also set library into 1 Bit mode (BW)
WebServer server(80);   // Create Web server on port 80 (HTTP port number)

IPAddress serverIP;
String txt;

void setup()
{
  inkplate.begin();                      // Init Inkplate library (you should call this function ONLY ONCE)
  inkplate.clearDisplay();               // Clear frame buffer of display
  inkplate.display();                    // Put clear image on display
  inkplate.setTextSize(3);               // Scale text to be three times bigger than original
  inkplate.setTextColor(INKPLATE_BLACK); // Set text color to black and background color to white
  inkplate.setTextWrap(true);            // If text does not fit on screen, send it to new line

  WiFi.begin();             // Init. WiFi library
  WiFi.mode(WIFI_AP);       // Set WiFi to Access Point mode
  WiFi.softAP(ssid, pass);  // Set SSID (WiFi name) and password for Access point

  serverIP = WiFi.softAPIP(); // Get the server IP address

  server.on("/", handleRoot); // If you open homepage, go to handle root function
  server.on(UriBraces("/string/{}"),
            handleString); // If you send some text to Inkplate, go to handleString function. Note that {} brackets at
                            // the end of address. That means that web address has some arguments (our text!).
  server.begin();          // Start the web server
  updatePaper();
}

void loop()
{
  server.handleClient(); // You have to constantly read if there is any new client connected to web server
}

void updateHTML()
{ // This function will send response to client and send HTML code of our web page
  server.send(200, "text/html", s);
}

void handleRoot()
{ // This function will send response to client if client open a root (homepage) of our web page
  updateHTML();
}

void handleString()
{ // This function will send response to client, send HTML code of web page, get the text from argument sent in web page
  // address and refresh screen with new text
  txt = server.arg(0);
  updateHTML();
  updatePaper();
}

void updatePaper()
{ // This function updates screen with new data (text)
  inkplate.clearDisplay();    // Clear everything from epaper frame buffer
  inkplate.setCursor(20, 40); // Print out instruction on how to connect to Inkplate WiFi and how to open a web page
  inkplate.print("Connect to ");
  inkplate.print(ssid);
  inkplate.println(" WiFi with pass: ");
  inkplate.setCursor(240, 100);
  inkplate.println(pass);
  inkplate.setCursor(100, 150);
  inkplate.print("Open Your web browser and open");
  inkplate.setCursor(240, 210);
  inkplate.print("http://");
  inkplate.print(serverIP);
  inkplate.println('/');
  inkplate.println();
  inkplate.fillRect(10, 240, 780, 4, BLACK);
  inkplate.println("User text:"); // Print out what user typed in web page
  inkplate.print(txt);
  inkplate.display(); // Send everything to screen (refresh the screen)
}

Korištene funkcije​

Inkplate()returns None

Stvara Inkplate objekt. Inkplate 7SPECTRA ima samo jedan šesterobojni način rada, pa konstruktor ne prima argument načina rada (komentar o 1-bitnom načinu potječe od drugih Inkplate pločica).

ReturnsKonstruktor; nema povratne vrijednosti.

inkplate.begin()returns void

Inicijalizira biblioteku, periferiju i međuspremnik slike. Pozovite je jednom u setup().

ReturnsNišta.

inkplate.clearDisplay()returns void

Ispunjava međuspremnik slike bijelom bojom. Ne mijenja prikaz na panelu.

ReturnsNišta.

inkplate.display(bool _leaveOn = 0)returns void

Šalje cijeli međuspremnik slike na panel i osvježava ga.

ReturnsNišta.

inkplate.setTextSize(uint8_t s)returns void

Postavlja povećanje teksta, ovdje 3.

ReturnsNišta.

inkplate.setTextColor(uint16_t c)returns void

Postavlja boju teksta, ovdje INKPLATE_BLACK.

ReturnsNišta.

inkplate.setTextWrap(bool w)returns void

Određuje nastavlja li se tekst koji ne stane u redak u sljedećem retku. Skica uključuje prelamanje teksta.

ReturnsNišta.

inkplate.setCursor(int16_t x, int16_t y)returns void

Postavlja mjesto na kojem počinje sljedeći ispisani tekst. Skica ga prije svakog retka uputa pomiče na fiksni položaj.

ReturnsNišta.

inkplate.print(value)returns size_t

Ispisuje tekst, znak ili IP adresu u međuspremnik slike, poput Serial.print().

ReturnsBroj ispisanih bajtova.

inkplate.println(value)returns size_t

Kao print(), a zatim pomiče kursor u sljedeći redak. Pozvana bez argumenta, samo prelazi u sljedeći redak.

ReturnsBroj ispisanih bajtova.

inkplate.fillRect(int16_t x, int16_t y, int16_t w, int16_t h, uint16_t color)returns void

Crta ispunjeni pravokutnik s gornjim lijevim kutom u točki (x, y). Skica iznad korisnikova teksta crta crnu traku široku 780 piksela i visoku 4 piksela.

ReturnsNišta.

IPAddress()returns None

Paket pločice za ESP32: tip koji sadrži IP adresu. Skica ga stvara kao `serverIP` i ispunjava adresom pristupne točke.

ReturnsKonstruktor; nema povratne vrijednosti.

WiFi.begin()returns wl_status_t

Paket pločice za ESP32: inicijalizira Wi-Fi biblioteku. Pozvana bez argumenata, ne spaja se na mrežu.

ReturnsStatus veze.

WiFi.mode(wifi_mode_t mode)returns bool

Paket pločice za ESP32: postavlja Wi-Fi način rada. Skica koristi WIFI_AP, način rada pristupne točke.

Returnstrue ako je način rada postavljen.

WiFi.softAP(ssid, pass)returns bool

Paket pločice za ESP32: pokreće pristupnu točku s zadanim nazivom mreže i zaporkom.

Returnstrue ako je pristupna točka pokrenuta.

WiFi.softAPIP()returns IPAddress

Paket pločice za ESP32: IP adresa pristupne točke. Skica je ispisuje na zaslonu kao adresu koju treba otvoriti u pregledniku.

ReturnsIP adresa pristupne točke.

WebServer(int port)returns None

Paket pločice za ESP32: objekt web poslužitelja. Skica ga stvara kao `server`, a on osluškuje na portu 80, HTTP portu.

ReturnsKonstruktor; nema povratne vrijednosti.

server.on(uri, handler)returns void

WebServer: postavlja funkciju koja odgovara na zahtjeve za određenu adresu. Skica šalje adresu početne stranice funkciji handleRoot(), a adresu /string/ iza koje slijedi upisani tekst funkciji handleString().

ReturnsNišta.

UriBraces(const char *uri)returns None

WebServer (uri/UriBraces.h): obrazac adrese u kojem svaki par vitičastih zagrada odgovara jednom dijelu adrese, koji rukovatelj čita pomoću server.arg().

ReturnsKonstruktor; nema povratne vrijednosti.

server.begin()returns void

WebServer: pokreće web poslužitelj.

ReturnsNišta.

server.handleClient()returns void

WebServer: obrađuje zahtjev klijenta koji čeka. Skica ga stalno poziva u loop().

ReturnsNišta.

server.send(int code, const char *content_type, const String &content)returns void

WebServer: odgovara na zahtjev. Skica šalje status 200, tip text/html i tekst web stranice `s` iz htmlCode.h.

ReturnsNišta.

server.arg(int i)returns String

WebServer: vrijednost argumenta zahtjeva i. Skica čita argument 0, tekst upisan na web stranici, u txt.

ReturnsVrijednost argumenta.

Što očekivati​

Pri pokretanju zaslon prikazuje Connect to Inkplate 7SPECTRA WiFi with pass: i zaporku Soldered, zatim redak Open Your web browser and open s adresom pristupne točke kao http:// i adresom, a potom crnu traku i User text: bez ikakvog teksta ispod. Nakon što mobitel ili računalo spojite na mrežu i otvorite tu adresu, preglednik prikazuje tekstni okvir s tekstom Write some text! i tipku Send to display!. Kada pritisnete tipku, zaslon se osvježi i vaš se tekst prikazuje ispod User text:.

🔗Otvorite cjelovit primjer

examples/Inkplate7SPECTRA/Advanced/WEB_WiFi/Inkplate7SPECTRA_HTTP_Web_Server

→