2017-09-07 1 views
1

Je vais essayer d'être aussi détaillé que possible, je ne suis pas à l'aise avec les tenants et les aboutissants de Javascript, donc cela pourrait être une question douloureusement basique.Hashing mot de passe en Javascript retournant résultat indéfini

Je dois saisir l'entrée de l'utilisateur, le hacher, puis le poster. J'utilise actuellement l'algorithme bCrypt du MIT, je n'ai pas besoin de l'utiliser spécifiquement, mais il doit être côté client. (Soit dit en passant, je sais que hacker des choses comme des mots de passe côté client n'est pas une bonne idée, j'ai beaucoup lu sur SO à ce sujet ... mais à ces fins, ce n'est qu'un exercice).

Je peux générer le sel, donc j'appelle avec succès cette fonction du fichier bCrypt.js, mais je rencontre des problèmes avec le hachage du mot de passe. Auparavant, j'étais capable d'obtenir le mot de passe hashed, mais je ne pouvais pas référencer cette variable ailleurs ou la poster. Maintenant, j'ai tout chamboulé et je n'arrive même pas à faire fonctionner le hash, il revient indéfini (c'est pourquoi je dois prendre l'habitude d'utiliser le contrôle de version).

Mon 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>

Mes js:

Et il est assez long pour poster ici, mais c'est l'algorithme bcrypt J'utilise: https://github.com/nevins-b/javascript-bcrypt/blob/master/bCrypt.js

Une exemple de la sortie de la console, je reçois systématiquement:

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-- C'est ce que je veux encore et, peu importe ce que je change:

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

Merci beaucoup pour toute aide ou suggestions, j'ont essayé de la recherche et ce dépanner beaucoup avant de venir pour être guidé, j'ai refait le tout une ou deux fois donc je pense qu'il me manque quelque chose de grand et d'évident ici.

+0

Qu'est-ce que '' result' dans hashpw (vieux, sel, résultat); '? – Thijs

+0

@Thijs: 'résultat de la fonction (hachage) {' – Cerbrus

+0

Apparemment, le rappel n'est pas appelé non plus. – Cerbrus

Répondre

0

Je suppose que vous utilisez les fonctions asynchrones de bcrypt. Soit vous utilisez les fonctions de synchronisation (genSaltSync et hashSync) ou vous lisez un peu sur les rappels. Je suggère la deuxième Wich résultats dans quelque chose comme:

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

Pour plus d'informations consultez la documentation: https://www.npmjs.com/package/bcryptjs

+0

Merci qui me pousse déjà dans la bonne direction, Je pensais que je rencontrais un problème lié à l'async. Et je ne connais pas très bien les callbacks. Question, cependant, qui ressemble à la fonction nodejs bcrypt ...?Je pensais que je ne pouvais pas utiliser cela puisque je suppose, puisque c'est nodejs, ce serait côté serveur. On m'a demandé de le réaliser spécifiquement côté client, ce que je comprends n'est pas la meilleure façon. –

+0

Je ne l'ai jamais utilisé dans le frontend, mais le modèle reste le même quelle que soit la bibliothèque que vous utilisez. Peut-être que votre libraire renvoie une promesse alors le callback est placé dans la fonction .then(). –