créer un code de connexion avec javascript

Question

Je développe un système d'inscription dans lequel les utilisateurs peuvent créer une chaîne aléatoire en appuyant simplement sur un bouton.

Ils peuvent ensuite envoyer cette chaîne à un non-utilisateur afin qu'il puisse l'utiliser pour s'inscrire. Le nouvel utilisateur insère un nom d'utilisateur et un mot de passe de son choix et de la chaîne qu'il a reçue.

Pour implémenter ce scénario, je suis à la recherche d'une fonction javascript qui peut créer une chaîne aléatoire. Vous pouvez envoyer une chaîne à la fonction et reconnaître si elle l'a créée ou non.

Des conseils pour créer un tel système et où puis-je trouver une telle fonction?

Merci

Modifier

Ceci est un groupe fermé d'utilisateurs dorsaux. Je suis déjà membre. Je peux créer une chaîne et envoyer à mon ami Jake par e-mail, skype, fb chat, peu importe. Je lui dis, "mettre tout nom d'utilisateur/mot de passe que vous voulez, mais mettez le code que je vous envoie dans le champ" Votre code "du formulaire d'inscription, sinon le système ne vous laissera pas vous inscrire". Après l'inscription de Jake, la chaîne n'est plus utile, car Jake a créé son propre mot de passe et cela est utilisé par le système pour l'identification. C'est le scénario.

J'insiste sur Javascript parce que je vais utiliser node.js/express.js, donc je suppose que tout ce que je fais, il doit être écrit en Javascript.

Je suppose que je pourrais utiliser quelque chose comme la version javascript de php b-crypt si cela existe. Ou pas. Je ne sais même pas comment commencer, donc des lignes directrices seraient utiles. Merci

Answer 1

D'accord, puisque vous avez spécifié que vous souhaitez utiliser express, voici quelque chose comme une solution à votre problème. Tout d'abord, vous vouliez un moyen de générer une chaîne aléatoire qui pourrait être identifiable par la fonction qui l'a créée - ce qui est impossible. Au lieu de cela, vous avez besoin de l'application de noeud pour mémoriser les chaînes qui ont été générées par cette fonction. Vous pouvez aller à ce sujet un certain nombre de façons, mais voici le processus que je vais décrivais:

• Vous créez une API simple express avec deux itinéraires: /generate et /enregistrer.

• demandant l'/générer URL génère une chaîne aléatoire sur le serveur, stocke cette chaîne dans un tableau de codes actifs sur le serveur, puis retourne cette chaîne.

• Le /registre itinéraire aura deux parties: la GET chemin retourne un formulaire HTML que votre ami devra remplir avec son code (que vous avez envoyé par courrier électronique), son nouveau nom d'utilisateur et son nouveau mot de passe. Le chemin POST envoie ces données au serveur et vérifie son code avec les codes stockés dans le tableau des codes actifs. Si son code correspond à l'un des codes dans le tableau, cela crée un utilisateur avec les informations d'identification qu'ils ont saisies dans le formulaire HTML (sinon, il renvoie une erreur, quelque chose comme invalid code error).De préférence, vous souhaiterez créer une page HTML pour demander l'URL /. Cela inclut un bouton qui attache une fonction onclick qui effectue un XMLHttpRequest de manière asynchrone à cette URL. Il affiche ensuite le code retourné dans un tag <p> (ou tout ce qui flotte votre bateau).

• Naturellement, vous devez également créer un formulaire HTML à l'adresse /register pour que l'ami puisse enregistrer son nouveau compte en utilisant le code que vous lui avez envoyé.

• Vous aurez besoin d'un type de base de données pour stocker vos informations d'identification utilisateur. Cela peut être quelque chose d'aussi simple qu'un fichier .json ou une base de données NOSQL plus sophistiquée. Je n'entrerai pas dans les détails de la mise en œuvre de ce projet, mais il existe un certain nombre de ressources importantes pour la mise en œuvre de votre choix.

Voici un aperçu de base pour le code que vous écririez:

itinéraires/index.js - ce serait dans votre application expresse

var activeKeys = []; 

router.get("/", function(req, res) { 
    var options = { 
     root: __dirname + '/public/', 
     dotfiles: 'deny', 
     headers: { 
      'sent-timestamp': Date.now() 
     } 
    }; 

    res.sendFile("index.html", options, function (err) { 
     if (err) { 
      console.log(err); 
      res.status(err.status).end(); 
     } 
     else { 
      return; 
     } 
    }); 
}); 

router.get("/generate", function(req, res) { 
    require('crypto').randomBytes(48, function(ex, buf) { 
     var token = buf.toString('hex'); 
     activeKeys.push(token); 
     res.send(token); 
     return; 
    }); 
}); 

router.get("/register", function(req, res) {  
    var options = { 
     root: __dirname + '/public/', 
     dotfiles: 'deny', 
     headers: { 
      'sent-timestamp': Date.now() 
     } 
    }; 

    res.sendFile("register.html", options, function (err) { 
     if (err) { 
      console.log(err); 
      res.status(err.status).end(); 
     } 
     else { 
      return; 
     } 
    }); 
}); 

router.post("/register", function(req, res) { 
    var validKey = keys.indexOf(req.body.code); 
    if (validKey < 0) { 
     res.send("invalid code error"); 
    } 
    else { 
     //here you would implement adding your newly created user to the database, 
     //and then sending a success response 
    } 
}); 

public/index .html - route par défaut, où l'utilisateur

<button id="generate">Generate Key</button> 
<p>Mail this to your friend!</p><p id="key"></p> 
<script> 
    document.getElementById("generate").addEventListener("click", function(e) { 
     var xhr = new XMLHttpRequest(); 
     xhr.addEventListener("load", function() { 
      document.getElementById("key").innerHTML(this.responseText); 
     }); 
     xhr.open("GET", "http://www.example.com/generate", true); 
     xhr.send(); 
    }); 
</script> 

public/register.html - votre ami enregistre son nouveau compte ici

<form method="post" action="/generate"> 
    <input placeholder="your code" name="code" type="text"></input> 
    <input placeholder="username" name="username" type="text"></input> 
    <input placeholder="password" name="password" type="password"></input> 
    <input placeholder="confirm" name="confirm" type="password"></input> 
</form> 

Cela devrait à peu près répondre à vos besoins.

VEUILLEZ NOTER: Je n'ai pas testé ce code, alors ne vous attendez pas à copier + coller et pour que cela fonctionne. Ceci est destiné uniquement à titre indicatif

Espérons que cela aide!