Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie erstelle ich einen Hash aus einer Zeichenfolge in JavaScript?

WBOY
Freigeben: 2023-08-25 15:49:04
nach vorne
1367 Leute haben es durchsucht

如何在 JavaScript 中从字符串创建哈希?

Bevor wir beginnen, wollen wir uns mit dem Hashing in JavaScript befassen. Ein Hashwert ist ebenfalls ein String, allerdings wird er mit einem bestimmten Algorithmus verschlüsselt. Normalerweise verwenden wir Hashes aus Sicherheitsgründen.

Google speichert beispielsweise die E-Mails und Passwörter der Nutzer in seiner Datenbank. Jetzt können Google-Mitarbeiter zu Entwicklungszwecken auf ihre Datenbank zugreifen. Aber können sie die E-Mail-Adresse und das Passwort des Benutzers aus der Datenbank abrufen? Nein, da Passwörter in gehashter Form gespeichert werden und der Mitarbeiter zum Entschlüsseln des Passworts den Schlüssel benötigt, den wir bei der Erstellung des Hashs aus der Passwortzeichenfolge verwendet haben.

Auf diese Weise können wir die Daten in das Hash-Format konvertieren. Wann immer wir die Originaldaten mit neuen Daten vergleichen müssen, können wir denselben Algorithmus verwenden, um die neuen Daten in einen Hash-Wert umzuwandeln und ihn mit dem Hash-Wert der Originaldaten zu vergleichen. Wir lernen, wie man in JavaScript einen Hash aus einem String erstellt.

Erstellen Sie einen Algorithmus zum Konvertieren von Zeichenfolgen in Hash

In dieser Methode erstellen wir eine benutzerdefinierte Funktion, um einen Hash-Wert aus einer Zeichenfolge zu generieren. Wir nehmen den ASCII-Wert jedes Zeichenfolgenzeichens, führen einige Operationen wie Multiplikation, Addition, Subtraktion, ODER usw. durch und generieren daraus einen Hash.

Grammatik

Benutzer können Hashes aus Zeichenfolgen generieren, indem sie der folgenden Syntax folgen.

for (let character of str) {
   let charCode = character.charCodeAt(0);
   hashString = hashString << 5 – hashString + charCode;
   hashString |= hashString;
}
Nach dem Login kopieren

In der obigen Syntax enthält Hashstring den endgültigen Hashwert von str string.

Algorithmus

  • Schritt 1 – HashString-Variable auf Null initialisieren.

  • Schritt 2 – Verwenden Sie eine for-of-Schleife, um über die Zeichenfolge zu iterieren.

  • Schritt 3 – Rufen Sie innerhalb der for-of-Schleife den ASCII-Wert jedes Zeichens ab.

  • Schritt 4 - Danach verschieben Sie hashString um 5 nach links, multiplizieren mit 31 und subtrahieren hashString davon.

  • Schritt 5 – Fügen Sie den ASCII-Wert des Zeichenfolgenzeichens zur hashString-Variablen hinzu.

  • Schritt 6 – Führen Sie eine ODER-Operation für den HashString-Variablenwert und sich selbst durch.

  • Schritt 7 – Sobald alle Iterationen der for-Schleife abgeschlossen sind, erhalten wir den endgültigen Hash-Wert der 32-Bit-Ganzzahl.

Beispiel 1

Im folgenden Beispiel haben wir verschiedene Zeichenfolgen verwendet, um ihre Hashes zu generieren. Wir haben die Funktion „convertToHash()“ erstellt, die einen String als Parameter verwendet und den obigen Algorithmus implementiert, um ihn in einen Hash-Wert umzuwandeln.

Benutzer können den 32-Bit-Ganzzahlwert beobachten, der den Hash-Wert in der Ausgabe darstellt. Darüber hinaus können wir beobachten, dass immer derselbe Hashwert für denselben String generiert wird.

<html>
<body>
   <h2>Creating the <i> custom hash function </i> to convert string to hash</h2>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById('output');
      function convertToHash(str) {
         if (str == "") return 0;
         let hashString = 0;
         for (let character of str) {
            let charCode = character.charCodeAt(0);
            hashString = hashString << 5 - hashString;
            hashString += charCode;
            hashString |= hashString;
         }
         output.innerHTML += "The original string is " + str + "<br/>";
         output.innerHTML += "The hash string related to original string is " + hashString + "<br/>";
         return hashString;
      }
      convertToHash("Hello Users");
      convertToHash("TutorialsPoint");
   </script>
</body>
</html>
Nach dem Login kopieren

Beispiel 2

Im folgenden Beispiel haben wir den obigen Algorithmus implementiert, um einen String in einen Hash umzuwandeln, aber wir haben die Reduce-Methode anstelle einer for-Schleife verwendet. Wir verwenden die Methode split(), um die Zeichenfolge in ein Zeichenarray umzuwandeln.

Danach haben wir die Methode Reduce() verwendet und die Callback-Funktion als ersten Parameter und 0 als zweiten Parameter übergeben, was den Anfangswert der Hash-Variablen darstellt. In der Callback-Funktion generieren wir den Hashwert anhand des ASCII-Werts jedes Zeichens.

<html>
<body>
   <h2>Using the <i> reduce() method </i> to convert string to hash</h2>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById('output');
      function hashUsingReduce(string) {
         if (string == "") return 0;
         let charArray = string.split('');
         let hash = charArray.reduce((hash, char) => ((hash << 5 - hash) + char.charCodeAt(0)) | hash, 0);
         output.innerHTML += "The original string is " + string + "<br/>";
         output.innerHTML += "The hash string related to original string is " + hash + "<br/>";
         return hash;
      }
      hashUsingReduce("JavaScript");
      hashUsingReduce("TypeScript");
   </script>
</body>
</html>
Nach dem Login kopieren

Verwendung des NPM-Pakets crypto-js

Crpyo-js ist ein Npm-Paket, das verschiedene Methoden zum Generieren von Hashes aus Strings enthält. Es enthält auch einige Algorithmen zum Entschlüsseln von Nachrichten.

Benutzer müssen das crypto-js npm-Paket mit dem folgenden Befehl in ihrem Knotenprojekt installieren.

npm i crypto-js
Nach dem Login kopieren

Grammatik

Benutzer können der folgenden Syntax folgen, um das crypto-js-Paket zu importieren und für die Ver- und Entschlüsselung zu verwenden.

var ciphertext = CryptoJS.AES.encrypt('string', 'secret key').toString();
Nach dem Login kopieren

In der obigen Syntax haben wir die encrypt()-Methode des AES-Moduls des cryptoJS-Pakets verwendet.

Parameter

  • String – Es handelt sich um eine Nachricht oder Daten im String-Format, die zum Generieren eines Hashs verwendet werden.

  • Der geheime Schlüssel ist der geheime Schlüssel, den der -Algorithmus beim Generieren des Hashs verwendet. So komplex der Hash auch ist, er erzeugt einen sichereren verschlüsselten Text.

Beispiel 3

Im folgenden Beispiel haben wir das crypto-js-Paket in die NodeJs-Datei importiert. Danach greifen wir auf das AES-Modul von CryptoJs zu und generieren mit der Methode encrypt() den Hash aus dem String.

Benutzer können die mit dem AES-Algorithmus generierten Hashwerte in der Ausgabe beobachten.

var CryptoJS = require("crypto-js");
// Encrypt
var encryptedText = CryptoJS.AES.encrypt('Your Welcome!', 'This is my Secret').toString();
console.log("The hash string is " + encryptedText);
Nach dem Login kopieren

Ausgabe

"The hash string is U2FsdGVkX19br0LjrHteC9+dlP2PS9dVT03IrTc9zwQ="
Nach dem Login kopieren

Dieses Tutorial zeigt uns zwei Möglichkeiten, Hashes aus Strings oder Daten zu generieren. Die erste Methode ist einfach und verschlüsselt Text ohne Schlüssel. Daher können wir es nicht in der tatsächlichen Entwicklung verwenden.

CryptoJs-Paket enthält verschiedene Module für verschiedene Algorithmen. Wir können eine Verschlüsselungsmethode mit jedem Algorithmus verwenden, der auch einen Verschlüsselungsschlüssel verwendet. Selbst wenn Sie den Algorithmus, aber nicht den Schlüssel kennen, können Sie den Chiffretext daher nicht entschlüsseln.

Das obige ist der detaillierte Inhalt vonWie erstelle ich einen Hash aus einer Zeichenfolge in JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:tutorialspoint.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!