2017-09-07 1 views
1

Ich werde versuchen, so detailliert wie möglich zu sein, ich bin nicht mit dem Ins und Outs von Javascript, so dass dies eine schmerzhaft grundlegende Frage sein könnte.Hashing Passwort in Javascript zurück undefined Ergebnis

Ich muss Benutzereingaben ergreifen, es hacken und dann posten. Ich benutze derzeit den bCrypt-Algorithmus von MIT, ich muss das nicht spezifisch verwenden, aber es muss clientseitig sein. (Nebenbei bemerkt, ich weiß, dass das clientseitige Hashing von Passwörtern keine gute Idee ist, ich habe viel über SO gelesen ... aber für diese Zwecke ist das nur eine Übung).

Ich kann das Salz erzeugen, also rufe ich diese Funktion erfolgreich aus der bCrypt.js Datei auf, aber ich stoße auf Probleme mit dem Hashing des Passworts. Zuvor konnte ich das Passwort hashed bekommen, konnte aber diese Variable nirgendwo anders erfolgreich referenzieren oder posten. Jetzt habe ich alles vermasselt und kann nicht einmal das Hashing funktionieren, es kommt undefined zurück (deshalb muss ich mir angewöhnen, die Versionskontrolle zu benutzen).

Mein Code:

var ROUNDS = 10; 
 

 
// \t Function grabs username and password from user's input 
 
// 
 
function submitButton() { 
 
    var userInput = document.getElementById('password').value; 
 
    var userName = document.getElementById('username').value; 
 

 
    hashPw(userInput, userName); 
 
} 
 

 
function result(hash) { 
 
    console.log('hash in callback is ' + hash); 
 
} 
 

 
function hashPw(old, name) { 
 
    console.log('hashPw called'); 
 
    console.log('old password= ' + old); 
 

 
    var salt = gensalt(ROUNDS); 
 
    hashpw(old, salt, result); 
 
    console.log('Salt= ' + salt) 
 
    console.log('hashed password='); 
 

 
}
<!DOCTYPE html> 
 
<html lang="en"> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>Hash</title> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous"> 
 
    <script src="bcrypt.js" type="text/javascript"></script> 
 

 
</head> 
 

 
<body> 
 
    <form> 
 
    <div class="form-group"> 
 
     <label>Username: </label> 
 
     <input type="text" id="username" class="form-control"> 
 
    </div> 
 
    <div class="form-group"> 
 
     <label for="password">Password: </label> 
 
     <input type="text" id="password" class="form-control"> 
 
     <span></span> 
 
    </div> 
 
    <button type="button" class="btn btn-primary" onClick="submitButton()">Submit</button> 
 
    </form> 
 

 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
 
    <script src="callHash.js" type="text/javascript"></script> 
 
</body> 
 

 
</html>

Meine js:

Und es ist ziemlich lange hier posten, aber dies ist der bcrypt Algorithmus ich verwende: https://github.com/nevins-b/javascript-bcrypt/blob/master/bCrypt.js

Ein Beispiel der Konsolenausgabe bekomme ich konsequent:

callHash.js:18 hashPw called 
callHash.js:19 old password= tryagain 
callHash.js:23 Salt= $2a$10$AwGCCKs5bXa1SNzdKLBytO 
callHash.js:24 hashed password=undefined 

EDIT-- Das ist, was ich immer und immer wieder bekommen, egal, was ich ändern:

bcrypt.js:467 [Violation] 'setTimeout' handler took 102ms 

Vielen Dank für jede Hilfe oder Anregungen so viel, ich habe versucht, dies zu erforschen und Ich habe die ganze Sache ein paar Mal überarbeitet, also denke ich, dass ich hier etwas Großes und Offensichtliches vermisse.

+0

Was ist 'result' in' hashpw (alt, Salz, Ergebnis); '? – Thijs

+0

@Thijs: 'Funktion Ergebnis (Hash) {' – Cerbrus

+0

Anscheinend wird der Rückruf auch nicht aufgerufen. – Cerbrus

Antwort

0

Ich nehme an, dass Sie die asynchronen Funktionen von bcrypt verwenden. Entweder Sie verwenden die Synchronisierungsfunktionen (genSaltSync und hashSync) oder Sie lesen ein wenig über Rückrufe. Ich würde die zweiten weichen Ergebnisse in so etwas wie vorschlagen:

var bcrypt = require('bcryptjs'); 
bcrypt.genSalt(10, function(err, salt) { 
    bcrypt.hash("B4c0/\/", salt, function(err, hash) { 
     // Store hash in your password DB. 
    }); 
}); 

Für weitere Informationen in die Dokumentation überprüfen: https://www.npmjs.com/package/bcryptjs

+0

Danke, das mich schon in die richtige Richtung schiebt, Ich dachte, ich würde in ein Async-Problem geraten. Und ich bin nicht in Callbacks versiert, also ist das genau richtig. Frage, das sieht jedoch aus wie die bcrypt-Funktion nodejs ...?Ich dachte, dass ich das nicht verwenden könnte, da ich annehme, da es nodejs ist, wäre es serverseitig. Ich wurde gebeten, diese Client-Seite speziell auszuführen, die ich sammle, ist nicht der beste Weg –

+0

Ich habe es nie im Frontend verwendet, aber das Muster bleibt gleich, egal welche Bibliothek du verwendest. Vielleicht gibt Ihre Bibliothek ein Versprechen zurück, dann wird der Rückruf innerhalb der Funktion .then() platziert. –