phonegap – secured pages – data-auth-needed

Posted: June 8, 2013 in jquery mobile, mobile, phonegap

I needed to secure my jquery mobile pages. Because it depends on user authentication to the server first.

I use this code for example to prevent the page from loading until user is logged in and redirect it to a login/register page:

$(document).bind(“pagebeforechange”, function (event, data) {

//alert (“trying”);
if (typeof data.toPage == ‘object’ && data.toPage.attr(‘data-needs-auth’) == ‘true’) {
//alert (“token= ” + sessionStorage.getItem(“token”));
if (!sessionStorage.getItem(“token”)) {
pageVars.returnAfterLogin = data;
//alert (“going to login page”);
$.mobile.changePage(“#login”, { changeHash: false });
else {
//alert (“going to normal page”);
//sessionStorage.setItem(‘token’, localStorage.getItem(“token”));

and mark the page like this

<div id=”workoutspage” data-role=”page”  data-needs-auth=”true”>

I had the original page init code in the devicereadyevent and I had to move it to the pageshow event. like so:

$(‘#workoutspage’).live(‘pageshow’, function (event) {

… init page stuff …


i had to do it like this becuase the devicereadyevent happens anyways no matter what. And i wanted to load the secured page content only if the actual page is loading…  (took it from here

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s