creating sign-in code with javascript

Question

I am developing a sign-up system where the users can create a random string by just hitting a button.

They can then send this string to a non-user so s/he can use it to sign-up. The new user inserts a username and a password of his/hers choice and the string s/he received.

To implement this scenario, I am looking for a javascript function that can create a random string. You can feed a string to the function and can recognize if it created it or not -throws an error.

Any tips for creating such a system and where can I find such a function?

Thanks

Edit

This is a closed group of back-end users. I am already a member. I can create a string and send to my friend Jake by e-mail, skype, fb chat, whatever. I tell him, "put whatever username/password you want, but put the code I send you to the 'Your Code' field of the signup form, otherwise the system wont let you sign up". After Jake signs up, the string is no longer useful, because Jake created his own password and that is used by the system for identification. That's the scenario.

I insist on Javascript because I am going to use node.js/express.js , so I guess whatever I make , it have to be written in Javascript.

I guess I could use something like the javascript version of php b-crypt if this exists. Or not. I dont even know how to begin, so any guidelines would be useful. Thanks

Answer 1

Okay, since you've specified you'd like to use express, here's something like a solution to your problem.

Firstly, you wanted a way of generating a random string which could be identifiable by the function that created it - which is impossible. Instead, you need the node application to remember the strings that have been generated by this function. You can go about this a number of ways but here is the process I will be outlining:

• You create a simple express API with a couple of routes: /generate, and /register.

• requesting the /generate URL generates a random string on the server, stores that string in an active codes array on the server, and then returns that string.

• The /register route will have two parts: the GET path will return an HTML form that your friend will have to fill in with his code (which you have emailed), his new username, and his new password. The POST path will send this data to the server, and check his code with the codes stored in the active codes array. If his code matches one of the codes in the array, this creates a user with the credentials they entered in the HTML form (otherwise it returns an error, something like invalid code error).

• Preferably, you'd want to create an HTML page for requesting the /generate URL. This would include a button that attaches a function onclick that makes an XMLHttpRequest asynchronously to this URL. It then displays the returned code in a <p> tag (or whatever floats your boat).

• Naturally you'd also be required to create an HTML form at the /register route, for the friend to register his new account using the code you emailed.

• You'll need some kind of database to store your user credentials. It could be something as simple as a .json file, or a more sophisticated NOSQL database. I won't go into the details of implementing this, but a number of great resources exist out there for whichever implementation you go with.

Here is a basic outline for the code you'd write:

routes/index.js - this would be in your express app

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 - default route, where the user

<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 - your friend registers his new account here

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

That should just about suit your needs.

PLEASE NOTE: I haven't tested any of this code, so don't expect to copy + paste and for it to work. This is meant only as a guideline

Hope this helps!