EWD 3 Training Course Part 10: QEWD Sessions and User Authentication

Copyright © 2016 M/Gateway Developments Ltd
EWD 3 Training Course
Part 10
QEWD Sessions and User
Authentication
Rob Tweed
Director, M/Gateway Developments Ltd
Twitter: @rtweed

Sessions and User Authentication
• These are two separate things:
– Application registration creates a Session
• Tied to the browser / client
• Not specifically the user
– Association of the Session with an actual user
/ person involves a process of authentication
• Usually initiated by a username/password
challenge

User Authentication
• In an interactive application, you'll have a
login form + Login button
• Clicking the Login button should trigger the
sending of a message that picks up the
username and password form field values

User Authentication
var messageObj = {
type: 'login',
params: {
username: $('#username').val(),
password: $('#password').val()
}
};
EWD.send(messageObj, function(responseObj) {
// either the user has provided valid credentials or not
// so do whatever is appropriate in both situations
});

User Authentication
• In back-end handler
login: function(messageObj, session, send, finished) {
var username = messageObj.params.username;
if (username === '') {
finished({error: 'You must enter a username');
return;
}
var password = messageObj.params.password;
if (password === '') {
finished({error: 'You must enter a password');
return;
}
// Validate username and password against authentication database records
var status = checkLogin(username, password); // however this works
if (status.ok) {
finished({ok: true});
}
else {
finished({error: status.error}); // return an error message string giving the reason for failed login
}
}

User Authentication
• We'll look at handling error responses in
the browser later
• For now, let's assume a successful login
has been achieved at the back-end:
– In the browser we'll want to modify the UI, eg:
• Remove the login form
• Bring up the user landing page & main menu

User Authentication
• User can now send messages to interact
with back-end information
– Potentially constrained by their profile / role
• But what's to stop a malicious user trying
to send those messages in the JavaScript
console before logging in?
– Technically nothing

User Authentication
• User can now send messages to interact
with back-end information
– Potentially constrained by their profile / role
• But what's to stop a malicious user trying
to send those messages in the JavaScript
console before logging in?
– Technically nothing
– So this is the purpose of authentication
• Special Session boolean property: authenticated

User Authentication
• In back-end handler
return;
}
return;
}
if (status.ok) {
session.authenticated = true;
}
else {
}
}

User Authentication
• All other back-end handlers
someType: function(messageObj, session, send, finished) {
if (!session.authenticated) {
finished({error: 'You do not have access to this message type'});
return;
}
// handle the message for authenticated users only….
}

User Authentication
• All other back-end handlers
someType: function(messageObj, session, send, finished) {
if (!session.authenticated) {
finished({error: 'You do not have access to this message type'});
return;
}
// handle the message for authenticated users only….
}
Your back-end methods are now protected
from hacking prior to user login

User Authentication
• Good idea to also prevent re-authentication
if (session.authenticated) {
finished({error: 'You are already logged in!'});
return;
}
return;
}
return;
}
if (status.ok) {
session.authenticated = true;
}
else {
}
}

Logging Out
• Often no need
– If user stops using the application for long
enough, the QEWD Session will expire
• Error message returned
• WebSocket will be disconnected
• Can add handler for socket disconnection
– ewd-session will eventually and automatically
clear down the QEWD Session global storage
for the user

Try it out

Edit app.js
$(document).ready(function() {
EWD.log = true;
EWD.on('ewd-registered', function() {
EWD.on('intermediate', function(responseObj) {
$('#content').text(responseObj.message.date);
});
EWD.on('socketDisconnected', function() {
$('#content').text('You have been logged out');
$('#testBtn').hide();
});
$('#testBtn').on('click', function(e) {
var message = {type: 'testButton'};
EWD.send(message, function(messageObj) {
$('#content').append('<br /> ' + messageObj.message.ok);
});
});
});
EWD.start('demo1', $, io);
});
Add a socket disconnected handler

Restart with a clean new session
$(document).ready(function() {
EWD.log = true;
EWD.on('ewd-registered', function() {
EWD.on('intermediate', function(responseObj) {
$('#content').text(responseObj.message.date);
});
EWD.on('socketDisconnected', function() {
$('#content').text('You have been logged out');
$('#testBtn').hide();
setTimeout(function() {
location.reload();
}, 1000);
});
$('#testBtn').on('click', function(e) {
var message = {type: 'testButton'};
EWD.send(message, function(messageObj) {
$('#content').append('<br /> ' + messageObj.message.ok);
});
});
});
EWD.start('demo1', $, io);
});

Manually disconnect the socket
• If you want an explicit logout:
– Simplest approach is to disconnect the
WebSocket connection:
• In app.js
• This will also trigger the socketDisconnected Event
EWD.disconnectSocket();

EWD 3 Training Course Part 10: QEWD Sessions and User Authentication

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (9)

Similar to EWD 3 Training Course Part 10: QEWD Sessions and User Authentication

Similar to EWD 3 Training Course Part 10: QEWD Sessions and User Authentication (20)

More from Rob Tweed

More from Rob Tweed (11)

Recently uploaded

Recently uploaded (20)

EWD 3 Training Course Part 10: QEWD Sessions and User Authentication