I had previously made a simple blogging app using Rollbase. The app worked well, if you were fine with anyone adding, editing, and deleting posts. However, for most blogs, while you want your posts to be publicly accessible, you only want trusted authors writing posts. I thus decided to modify my blogging app so that only logged in users would be able to submit content. At the same time, with known authors, I was able to show each post’s author. With these changes in mind, I started adding features to my previous app. (The rest of the post assumes you have worked with the previous blogging app.) To follow along, you can view the GitHub project at https://github.com/progress/angular-rollbase-blog/tree/login (the login branch of angular-rollbase-blog).
The first thing I needed to do was add a login page. This involved writing the AngularJS and Jade code so that a simple login page would be displayed. To actually verify users, I decided that I would pass the login credentials back to the NodeJS layer. This layer would call the Rollbase API to check if a user was actually valid. If the user was valid, Rollbase would return a temporary sessionId, which I would then be able to use in other parts of the application. I decided to store the returned sessionId at the Angular layer. One disadvantage with this approach is that every time the user refreshes the page, the user has to log on again. There are ways of getting over this limitation, for example by using cookies, but since my focus was on writing a simple app, I decided to ignore this issue for now. Most importantly, by having the backend, as opposed to the AngularJS layer, deal with logging in, I prevented the user from easily bypassing login and made the login much more secure.
With a login page in place, I next decided that I would have the app appear differently for logged in and regular users. To do this, I just checked if there was a sessionId stored in the AngularJS layer. Depending on its existence, different options would be presented to users. For example a logged in vs not logged in user has been shown below.
With this, I had a basic app, where only logged in users could post. However, if someone decided to modify the client facing code, which users can do, they would be able to still edit the blog. Because of this, I had to modify my edit, delete, and add post functions so that they would be called with a sessionId. This meant that only if the user passed in a valid sessionId, which would only be the case if they had logged on, would they be able to actually modify the blog.
Now that I had users associated with posts, I was also able to add an author section to each post. Because each sessionId is associated with a user, when I was posting with a sessionId, the user was automatically being stored. When I went to the Rollbase fields page (shown below), I decided that the author I would use would be the updatedBy author (the last person to update the post), not the createdBy one; however, either author could have been chosen. This data was already associated with each post, and I just had to display it in my final webpage.
With this, I had a blog which had authors associated with each post, and my blog was no longer free for anyone to edit. The updated blog can be found on: http://angularrollbaseblog2-21893.onmodulus.net.