HyperDrive: Update #3

Intended Audience: Marija Bezbradica (FYP Supervisor)

Made progress with:

  • Implementing oauth2 on server.
  • Building basic todo app with Apache Cordova & Ionic framework.
  • Redesigning application entity models.

I’ve been able to implement oauth2 implicit flow (a.k.a. client side flow) in a basic spring boot application. Below is a diagram I found online which helps to visualise the process. In my case the Authorization & REST API tasks are both being handled by the same server.

To speed up the development of the server I used a hard coded username and password. Below you can see a screen shot containing the request parameters. I am using the postman HTTP request client to test the api. oauth2 params

The request also has an ‘Authorization’ header set which contains ‘Basic’ + client_id : clientsecret encoded with base64.

oauth2 request header

When all of the parameters are valid and the username & password match a valid user, an access token and refresh token are generated. These are currently being stored in an h2 database along with a time to live for the tokens. The time to live indicates how long the tokens are valid, before requiring the user to re authenticate with their credentials.

Below is the response received from the server when correct credentials are supplied.

oauth2 responseFor the purpose of this project the server will be using http to reduce complexity. In a real life production environment this type of authentication protocol should always be implemented using HTTPS!

While developing the server has been my priority thus far I have also spend some time getting to grips with mobile development using Apache Cordova and the Ionic framework.

After spending some time reading up on the documentation for both projects I started off by building a basic ‘todo’ application by following a youtube tutorial.

Here are some screenshots I stitched together with photoshop:

todo-screen shots
This project makes use of some basis Ionic components such as:

  • ion-pane
  • ion-header-bar
  • ion-content
  • ion-list
  • ion-item
  • ion-option-button
  • $ionicPopup
  • $ionicListDelegate

When I wasn’t working on the server or mobile application I put some thought into refining the design of the project entities and their relationship with each other.

Here is a diagram of my current entities as they stand. These entities might require some slight changes as the project progresses.Screen Shot 2016-04-04 at 18.59.13

HyperDrive: Update #2

Intended Audience: Marija Bezbradica (FYP Supervisor)

Made progress with:

  • Learning Spring Boot
  • Setting up build / deployment pipeline
  • Setting up mobile development workspace

Learning spring:

Over the last couple of weeks i’ve put a considerable amount of time into learning the basics of spring and spring security.

  • I built a simple login application using basic security.
  • Next is to implement oauth2.

The front end AngularJs code and the API are all in one project at the moment. I’m using the Wro4j maven plugin to resolve the angular dependancies and optimize the resources. I plan on splitting the front and back end into two separate projects. This will give me more flexibility with the tools I use while developing the front end.

Build pipeline:

I’ve spent the last few days setting up the build pipeline, refer to previous post for more details that the process involved. Here’s a basic overview of the system:

  • On each code commit a webhook triggers a Jenkins build.
  • Code is cloned from github, tests are run, if tests pass project jar is built.
  • Jenkins run command to stop HyperDrive API via ssh.
  • Jar file is copied to deployment server.
  • Jenkins starts API via ssh.

Mobile application:

  • Spent time learning the basics of Apache Cordova.
  • Set up development environment.
  • Built basic application using IONIC framework template.
  • Launched application via iOS emulator.