© saicle/Shutterstock.com
PHP Magazin
Implementierung einer Enigma

Der Weg zum Geheimalphabet

Im letzten Teil unserer vierteiligen Serie geht es jetzt an die Implementierung der Enigma mit React und JavaScript von der Tastatur über die Eintrittswalze bis zum Lampenfeld.

Wolfgang Schmidt


Quellcode zum Download

ArtikelserieTeil 1: GrundlagenTeil 2: Variationen der Caesar-VerschlüsselungTeil 3: Die Enigma – Geschichte und TechnikTeil 4: Implementierung einer Enigma

Nach den vielen Hintergrundinformationen, die in den vorhergehenden Teilen gegeben wurden, kommen wir nun zur Implementierung. Wir werden eine Enigma I mit folgenden Komponenten implementieren:

TastaturSteckerbrettEintrittswalzedrei bewegliche Walzen (Rotoren)eine unbewegliche UmkehrwalzeLampenfeld

Zu Beginn schauen wir uns das Ende des Quellcodes an. Der Quellcode wird nicht komplett abgedruckt, da er ca. 550 Zeilen lang ist, er ist aber online auf www.entwickler.de verfügbar [1]. Dort befindet sich ebenfalls die Datei enigma.css, die das Stylesheet für die Darstellung enthält, welches wir hier nicht abdrucken.

Der Code in Listing 1 konfiguriert unsere Enigma: rotor2Schema, das der Walze 3 entspricht, wird das Verdrahtungsschema des dazugehörigen Walzentyps zugeordnet. rotor2Position ist mit der Walzenposition belegt und rotor2Offset enthält die Verstelldifferenz des sichtbaren Buchstabens zum intern verwendeten Buchstaben. Analog werden die anderen Walzen konfiguriert. Das entspricht einer Rotoreneinstellung „BAS“.

Listing 1ReactDOM.render( , document.getElementById('root'));

Die Walzenschemata sind an anderer Stelle als Konstanten definiert:

const ROTOR_I_SCHEMA = ["EKMFLGDQVZNTOWYHXUSPAIBRCJ", "R"];const ROTOR_III_SCHEMA = ["BDFHJLCPRTXVZNYEIWGAKMUSQO", "W"];const ROTOR_IV_SCHEMA = ["ESOVPZJAYQUIRHXLNFTGKDCMWB", "K"];

Das erste Element der Liste enthält dabei das Geheimalphabet, das zweite die Position der Übertragskerbe. Bei deren Erreichen wird der weiter links liegende Rotor um eine Position mitrotiert.

Listing 2 enthält den Konstruktor der Klasse Enigma. Hier werden im Wesentlichen die übergebenen Properties ausgelesen. Daraus werden die sichtbaren Buchstaben für die Anzeige berechnet (visibleRotorPosition2, visibleRotorPosition1, visibleRotorPosition0). Außerdem werden die Konfigurationsdaten für die Rotoren in den Arrays this.rotorConfigs, this.rotorPositions und this.rotorOffsets gespeichert, um später bei der Anzeige über diese Arrays in einer Schleife iterieren zu können.

Listing 2class Enigma extends React.Component { const...

PHP Magazin
Implementierung einer Enigma

Der Weg zum Geheimalphabet

Im letzten Teil unserer vierteiligen Serie geht es jetzt an die Implementierung der Enigma mit React und JavaScript von der Tastatur über die Eintrittswalze bis zum Lampenfeld.

Wolfgang Schmidt


Quellcode zum Download

ArtikelserieTeil 1: GrundlagenTeil 2: Variationen der Caesar-VerschlüsselungTeil 3: Die Enigma – Geschichte und TechnikTeil 4: Implementierung einer Enigma

Nach den vielen Hintergrundinformationen, die in den vorhergehenden Teilen gegeben wurden, kommen wir nun zur Implementierung. Wir werden eine Enigma I mit folgenden Komponenten implementieren:

TastaturSteckerbrettEintrittswalzedrei bewegliche Walzen (Rotoren)eine unbewegliche UmkehrwalzeLampenfeld

Zu Beginn schauen wir uns das Ende des Quellcodes an. Der Quellcode wird nicht komplett abgedruckt, da er ca. 550 Zeilen lang ist, er ist aber online auf www.entwickler.de verfügbar [1]. Dort befindet sich ebenfalls die Datei enigma.css, die das Stylesheet für die Darstellung enthält, welches wir hier nicht abdrucken.

Der Code in Listing 1 konfiguriert unsere Enigma: rotor2Schema, das der Walze 3 entspricht, wird das Verdrahtungsschema des dazugehörigen Walzentyps zugeordnet. rotor2Position ist mit der Walzenposition belegt und rotor2Offset enthält die Verstelldifferenz des sichtbaren Buchstabens zum intern verwendeten Buchstaben. Analog werden die anderen Walzen konfiguriert. Das entspricht einer Rotoreneinstellung „BAS“.

Listing 1ReactDOM.render( , document.getElementById('root'));

Die Walzenschemata sind an anderer Stelle als Konstanten definiert:

const ROTOR_I_SCHEMA = ["EKMFLGDQVZNTOWYHXUSPAIBRCJ", "R"];const ROTOR_III_SCHEMA = ["BDFHJLCPRTXVZNYEIWGAKMUSQO", "W"];const ROTOR_IV_SCHEMA = ["ESOVPZJAYQUIRHXLNFTGKDCMWB", "K"];

Das erste Element der Liste enthält dabei das Geheimalphabet, das zweite die Position der Übertragskerbe. Bei deren Erreichen wird der weiter links liegende Rotor um eine Position mitrotiert.

Listing 2 enthält den Konstruktor der Klasse Enigma. Hier werden im Wesentlichen die übergebenen Properties ausgelesen. Daraus werden die sichtbaren Buchstaben für die Anzeige berechnet (visibleRotorPosition2, visibleRotorPosition1, visibleRotorPosition0). Außerdem werden die Konfigurationsdaten für die Rotoren in den Arrays this.rotorConfigs, this.rotorPositions und this.rotorOffsets gespeichert, um später bei der Anzeige über diese Arrays in einer Schleife iterieren zu können.

Listing 2class Enigma extends React.Component { const...

Neugierig geworden?


   
Loading...

Angebote für Teams

Für Firmen haben wir individuelle Teamlizenzen. Wir erstellen Ihnen gerne ein passendes Angebot.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang