1

How can I prevent the default behavior on internal linked pages?

My goal is to prevent the user from accessing page contents without first authenticate.

AstroCB
  • 11,800
  • 20
  • 54
  • 68
Diogo Cardoso
  • 19,349
  • 24
  • 92
  • 137

3 Answers3

1

Recently I was facing the same situation. I was using jQuery Mobile along with jQuery Templates, all sensitive data coming from a web service.

My solution was to register a callback with the pagebeforeshow event for any page that the user needs authorization for. Within this callback function, I checked if the user is authorized, in my case this is a JSONP web service call, which either returns the data, or an appropriate error code.

Then, if the user is authorized, the data is rendered with jQuery Templates; otherwise I redirect the user to a login page, using $.mobile.changePage().

Christoph Baudson
  • 1,071
  • 11
  • 12
  • Is it possible to prevent the page from showing up? event.preventDefault() isn't working. – Diogo Cardoso Jun 28 '11 at 13:56
  • You could of course hide the content when the pagebeforeshowevent occurs. In my case all pages have IDs, so I use this selector for the content: $( "div[id='" + id + "']" ).children( 'div[data-role="content"]' ).hide(); – Christoph Baudson Jun 28 '11 at 14:04
  • Another question: On which event do you call preventDefault? You have to realize that your callback must fire before jQuery Mobile's callbacks fire. – Christoph Baudson Jun 28 '11 at 14:06
  • I'm not sure it works this way. AFAIK, jQuery Mobile registers a vclick event with all links, and then calls changePage internally. When you register with pagebeforehide, it's already too late. Either you go with pagebeforeshow, or dig deeper in the jQuery Mobile source. – Christoph Baudson Jun 28 '11 at 14:35
  • I used pagebeforeshow instead of pagebeforehide but the problem remains. Here's the code: http://pastebin.com/sW9jDhWs – Diogo Cardoso Jun 28 '11 at 14:41
  • You can't use preventDefault, as there is no default behaviour. I guess the only option you have is hiding the content, which is also tricky, as the content is not definitely available until the pageshow event fires. In short: This is tricky with the current state of jQuery Mobile. – Christoph Baudson Jun 28 '11 at 14:51
0

In beta3, you can make use of the "Dynamically Injecting Pages" technique as described here:

http://jquerymobile.com/test/docs/pages/page-dynamic.html

Christoph Baudson
  • 1,071
  • 11
  • 12
-1

User authentication is a server-side thing and can't be implemented in javascript!

What stops me from sending a GET request myself then?

Pages that are not accessible without login should redirect to a login page if user is not authenticated. If you use web services directly from javascript, then they should return errors if the user is not authenticated.

Blocking access to pages in javascript is ridiculous. [But I have to admit that I've seen it before in commercial products...]

edit

Ok, to answer the question...

It depends on how the behaviours are attached to the page. If you use live with pageshow or pagecreate for those behaviours - then you can use a pagebefore* event and return false

another edit

I seem to understand the issue better. You have webservices and I will asume that they are secure and you don't want to make requests and get the 'error - not autenticated' response - there's no need to do so. And you use multiple pages in one html document.

With these assumptions I say you need to write a little wrapper over the $.mobile.changePage() - something like this:

$.mobile.changePageIf(condition,what,how,bool1,bool2){
if(condition){
  $.mobile.changePage(what,how,bool1,bool2);
  }else{
  //display "log in, dude!" or whatever
  }
}

And use the wrapper instead of the original function everywhere, putting a condition that returns true if you know user is logged in.

naugtur
  • 16,479
  • 5
  • 65
  • 107
  • I'm using web services directly from javascript and they return errors if the user is not authenticated. Why is it ridiculous to block access to pages in javascript? My goal is to prevent not authenticated users from viewing other pages. – Diogo Cardoso Jun 28 '11 at 14:30
  • 'other pages' should not be served to the user if he is not authenticated. The server should send a "please log in or something" page instead. This shouldn't have anything to do with javascript. – naugtur Jun 29 '11 at 07:26
  • I understand your point of view but I'm only using JavaScript with AJAX requests to the WebServices. Some of those pages may not need to consume a service on page load. Whats the best approach in this case? Between, I tried using the pagebeforeshow event but I'm unable to prevent the page from showing up. – Diogo Cardoso Jun 29 '11 at 08:17
  • You can transition back. Im not sure with which `page*` event - not all of them have the reference to the previous page. But that's getting absurd. See my new edit. – naugtur Jun 29 '11 at 08:42