Question

I’m working on a HTML5 mobile app. The app only uses 1 html file which contains a login form. On submit javascript posts the username and password to a php script on the server which returns ‘true’ or ‘false’.

When the authentication returns true the app changes the html5 page and stores the username and password in html5 local storage.

Since this is sensitive data my question is how to store these values in a secure way?

function handleLogin() {
    var form = $("#loginForm");    
    var u = $("#username", form).val();
    var p = $("#password", form).val();
    if(u != '' && p!= '') {
        $.post("http://www.mywebsite.com/login.php", {username:u,password:p}, function(res) {
            if(res == true) {
                //store
                window.localStorage["username"] = u;
                window.localStorage["password"] = p;             
                $.mobile.changePage("index-2.html");
            } else {
                /// error message
            }
         $("#submitButton").removeAttr("disabled");
        },"json");
    }
    return false; }

Answer 1

I would suggest using Access tokens, since this can be updated and changed frequetly, it also doesnt reveal who the user or what their hashed password is.

http://php.net/manual/en/oauth.getaccesstoken.php

Edit: You do NOT want to use localStorage!