Secure SPA Sites

I am planning to design a new dashboard site using the SPA method. All seems to be going well except the fact that only the home page seems to be secure.

Do I need to add a Security Enforcer to all the sub pages as well?

Hmmm, okay. I think I found an issue with using SPA method for a secure dashboard. You can’t add enforcer to the sub pages. And since the main index page never gets reloaded the user session never gets refreshed and times out but does not prevent use of the dashboard (force relog in).

@brad,

What I’ve seen happen on my secure SPA is that when it times out, anything that uses server connect will not be available. However, I think that is more due to the security restrict and enforcer combination. I have all my tables restricted.

It would be helpful if the secure SPA times out to redirect to the login page, but I have not been able to figure that out. I’ve been using my logout button to quickly get logged back in.

Thanks Scott,

And what happens when the server connect is not available?

No content that relies on the server connect is shown until the page is refreshed. Then the security enforcer kicks in and redirects to the login page.

The image above is of one of my sites. I have had it up since this morning but haven’t touched it. I can click on any of the links in my header and it will load the route page, but not display the table content until I refresh the page.

How are forms effected? Can users still submit forms once the user session times out?

There must be a way to refresh the user session when a sub page loads or a server connect is accessed. I can see this being a huge issue.

No, the form will not submit. At least mine will not because I have the security restrict on it that requires the user to be logged in with the correct permission.

Here is an image from the same page. The client side validation works, but the form will not submit because I am not logged in.

So you have added a Security Restrict step to your inputs and updates as well?

Since this is my admin back end, I have security restrict on everything. (insert, update, delete, list) I don’t want anyone being able to do anything on my admin back end unless they are logged in and have permission.

I’ve been thinking about this issue a lot, the only thing I can think of is some kind of session solution, but sadly I do not know enough about sessions to come up with a solution.

I have to do some further testing but I think I found a way to keep the user logged in on a secure SPA site.

On my index page (main template) I have a server connect showing the user details of the logged in user. I set a scheduler to reload that query every 15 minutes. It seems to be working to keep the user logged in.

I’m going to test it tonight by leaving it logged in this evening. Come back in a couple hours and see if it is still logged in.

2 Likes

Good idea, I have a get user details query on my index page as well, I’ll add a scheduler to see if it will work for me.

1 Like

Interested to hear the result of this…

You just need to add the security enforcer to the main / index page(s) as those are always loaded and then any routes are filled in with content pages.

So securing those should be enough

1 Like

Using the Scheduler did not work for me.

@George,

Using the security enforcer will secure the page and routes, but the concern is what happens when the session times out.

For example, I have open my SPA page and I am logged in. I leave the browser window open for say an hour and come back to the page. The page will still function, but any database content that is protected by security restrict will be unavailable because there is no longer a valid session. The only solution is refresh the page. Upon refreshing the page, the security enforcer will redirect you to the login page to login again.

1 Like

I’m pretty sure this is true for a “true” SPA too eg. Angular, react, VueJS etc. (Wappler seems to be using the Pjax/Turbolinks technique). So in a regular SPA, you’d get a token from the REST API, store it in a cookie or local storage and send that token with each request to the REST API. The user could leave the page open while the token expires, the “page” will still be interactive, but any requests to the REST API will be invalid. In this scenario, the SPA would then redirect to the login route.
I haven’t tested this in Wappler, but if the session has expired, does it not throw an error that you can catch and in there redirect them to the login route?

Hi Niall,
The logged user session is created on log in like explained here:

You can add a condition and set response if the session has a value or not. Then you can do redirect based on the response.

1 Like

User the scheduler method seems to have worked for me. I logged in, left the page for about an hour and a half, came back and refreshed the page and I was still logged in.

So, is there a way to fire an alert, or better yet, redirect as soon as that session expires?

I’m guessing you could poll this action so if it doesn’t have a value it will automatically redirect the user?