Zum Hauptinhalt springen

HTTPS mit einem Zertifikat

Was dieses Beispiel zeigt​

Lädt ein Bild von einer Website über HTTPS herunter, wobei das Zertifikat der Website beim Verbindungsaufbau geprüft wird, und zeigt es auf dem Bildschirm an. Anschließend versucht der Sketch, mit demselben Zertifikat ein Bild von einer anderen Website zu laden. Das schlägt fehl, weil das Zertifikat für diese Website nicht gültig ist, und der Bildschirm meldet dies.

Das Zertifikat im Sketch ist das für https://varipass.org. Laut Header des Sketches öffnet er .bmp-Dateien mit einer Farbtiefe von 1, 4, 8 oder 24 Bit.

Tragen Sie vor dem Hochladen Ihren Netzwerknamen und Ihr Passwort zwischen die Anführungszeichen von ssid und password ein.

Beispielcode​

Select Board
Inkplate7SPECTRA_HTTPS_With_Certificate.ino
#include "Inkplate.h"            // Include Inkplate library to the sketch
Inkplate display; 

const char ssid[] = "";    // Your WiFi SSID
const char *password = ""; // Your WiFi password

//This is the certificate for the website https://varipass.org

const char* certificate = \
"-----BEGIN CERTIFICATE-----\n" \
"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\n" \
"-----END CERTIFICATE-----\n";

void setup()
{
  display.begin();        // Init Inkplate library (you should call this function ONLY ONCE)
  display.clearDisplay(); // Clear frame buffer of display
  display.display();      // Put clear image on display

  display.print("Connecting to WiFi...");
  display.display();
  display.connectWiFi(ssid, password);
  
  while (!display.isConnected())
  {
    delay(500);
    display.print(".");
    display.display();
  }
  display.println("\nWiFi OK! Downloading...");
  display.display();

  //Apply the certificate previously defined
  display.applyHttpsCertificate(certificate);
  //Here we will draw the image using a valid certificate. Photo taken by: Roberto Fernandez
  if (!display.image.draw("https://varipass.org/neowise_mono.bmp", 0, 0, false, true))
  {
    // If is something failed (wrong filename or wrong bitmap format), write error message on the screen.
    // REMEMBER! You can only use Windows Bitmap file with color depth of 1, 4, 8 or 24 bits with no compression!
    display.println("Image open error");
    display.display();
  }
  display.display();
  delay(3000);
  display.clearDisplay();
  //Next we will try to load an image from a different website, which will not work as the certificate is 
  //not valid for this page
  if (!display.image.draw("https://raw.githubusercontent.com/SolderedElectronics/Inkplate-Arduino-library/master/examples/Inkplate5V2/Advanced/WEB_WiFi/Inkplate5V2_Show_JPG_With_HTTPClient/image.jpg", 0, 100, true, false))
  {
    display.println("This image wont load as the certificate is invalid");
    display.display();
  }
  display.display();

  display.disconnect();
}

void loop()
{
  // Nothing...
}

Dieses Beispiel verwendet außerdem delay(), das zum ESP32-Board-Package (arduino-esp32) gehört und nicht Teil der Inkplate-Bibliothek ist.

Verwendete Funktionen​

Inkplate()returns None

Erstellt das Inkplate-Objekt. Inkplate 7SPECTRA hat nur einen einzigen Sechs-Farben-Modus, daher erwartet der Konstruktor kein Modus-Argument.

ReturnsKonstruktor; kein Rückgabewert.

display.begin()returns void

Initialisiert die Bibliothek, die Peripherie und den Framebuffer. Rufen Sie sie einmal in setup() auf.

ReturnsNichts.

display.clearDisplay()returns void

Füllt den Framebuffer mit Weiß. Das Panel wird dadurch nicht verändert.

ReturnsNichts.

display.display(bool _leaveOn = 0)returns void

Sendet den gesamten Framebuffer an das Panel und aktualisiert es.

ReturnsNichts.

display.print(value)returns size_t

Gibt Text in den Framebuffer aus, wie Serial.print(). Der Sketch verwendet sie für den Statustext und die Verbindungspunkte.

ReturnsAnzahl der ausgegebenen Bytes.

display.println(value)returns size_t

Gibt Text in den Framebuffer aus und springt in die nächste Zeile, wie Serial.println().

ReturnsAnzahl der ausgegebenen Bytes.

display.connectWiFi(const char *ssid, const char *pass, int timeout = WIFI_TIMEOUT, bool printToSerial = false)returns bool

Verbindet mit dem WLAN. timeout ist standardmäßig 23, der WIFI_TIMEOUT der Bibliothek. printToSerial ist standardmäßig false.

Returnstrue, wenn die Verbindung hergestellt wurde.

display.isConnected()returns bool

Meldet, ob das Board mit dem WLAN verbunden ist. Der Sketch wartet in einer Schleife und gibt alle halbe Sekunde einen Punkt aus, bis dies der Fall ist.

Returnstrue, solange die Verbindung besteht.

display.applyHttpsCertificate(const char *certificate)returns void

Übergibt der Bibliothek das Zertifikat, gegen das HTTPS-Verbindungen geprüft werden. Hier ist es das Zertifikat für varipass.org, daher schlägt eine Anfrage an eine andere Website fehl.

ReturnsNichts.

display.image.draw(const char *path, int x, int y, bool dither = 1, bool invert = 0)returns bool

Zeichnet ein Bild an der Position x, y; die Bibliothek wählt den Decoder anhand der Dateiendung der Adresse. Der erste Aufruf zeichnet das Bitmap von varipass.org bei 0, 0 mit ausgeschaltetem Dithering und eingeschaltetem Invertieren. Der zweite Aufruf zeichnet ein JPEG von raw.githubusercontent.com bei 0, 100 mit eingeschaltetem Dithering und ausgeschaltetem Invertieren.

Returnstrue, wenn das Bild gezeichnet wurde.

display.disconnect()returns void

Trennt die Verbindung zum WLAN.

ReturnsNichts.

delay(unsigned long ms)returns void

Wartet die angegebene Anzahl von Millisekunden: 500 zwischen den Verbindungspunkten und 3000 zwischen den beiden Bildern.

ReturnsNichts.

Was Sie erwartet​

Der Bildschirm zeigt Connecting to WiFi..., gefolgt von einem Punkt alle halbe Sekunde, bis das Board verbunden ist, dann WiFi OK! Downloading.... Anschließend wird das Bild von varipass.org gezeichnet. Nach drei Sekunden wird der Bildschirm gelöscht und der Sketch versucht, das zweite Bild zu laden. Da das Zertifikat für diese Website nicht gültig ist, zeigt der Bildschirm This image wont load as the certificate is invalid. Lässt sich das erste Bild nicht öffnen, zeigt der Bildschirm Image open error. Der Sketch gibt nichts im Serial Monitor aus.

🔗Vollständiges Beispiel öffnen

examples/Inkplate7SPECTRA/Advanced/WEB_WiFi/Inkplate7SPECTRA_HTTPS_With_Certificate

→