Develop protected serverless web applications  

Utilize IBM Cloud Functions with OAuth 2.0 to enable authentication and authorization

Last updated | By Niklas Heidloff, Andy Shi

Description

IBM Cloud Functions, based on Apache OpenWhisk, is a Function-as-a-Service (FaaS) platform, which executes functions in response to incoming events and costs nothing when not in use. It kicks up when the code is run, and it goes away when not needed. In this developer code pattern, we demonstrate how to utilize IBM Cloud Functions with OAuth 2.0 to enable the authentication and authorization in a web app.

Overview

Web apps need authentication and authorization. This seems redundant, yet for so many years, there has been no reusable solution. OAuth definitely took a big step forward by introducing third-party authentication and authorization. Still, authentication and authorization takes up a lot of deployment packaging and hosting resources, considering users only log in once for a relatively long time.

In this code pattern, we have a web app written in Angular. We will set up the Google OAuth API so users can log in to their Google accounts via OAuth. Of course, in the web app, the code already exists to invoke IBM Cloud Functions. We still need to define the actions via the IBM CLI. After we wire everything up, we can see how the login process invokes the IBM Cloud Functions action to fire the OAuth request to the Google API and return the token to the Angular web app. Note that the web app doesn’t have to be hosted in a specific environment; it just needs to reach the serverless APIs.

Flow

  1. User opens Angular via web browser and clicks login.
  2. Angular app opens Google OAuth web page, where users authenticate and grant application access.
  3. Google page redirects to OpenWhisk sequence oauth-login-and-redirect with a code parameter in the URL.
  4. The sequence is triggered. The first OpenWhisk function oauth-login reads the code and invokes a Google API endpoint to exchange the code against a token.
  5. The same oauth-login function invokes with the token another Google API endpoint to read user profile information, such as the user name.
  6. The sequence invokes the next OpenWhisk function redirect, which invokes the Angular app with the token and the user name in the URL.
  7. When users click on invoke protected action in the Angular app, a REST API to the API management is invoked. The request contains the token.
  8. API management validates the token. If valid, the OpenWhisk function protected-action is invoked.
  9. The response from protected-action is displayed in the Angular app.

Related Blogs

Transformation everywhere – IBM Code at CEBIT 2018

As you may already know, 2018 was a pivotal year for CEBIT for many reasons. The fair has undergone a complete makeover; you would hardly recognize it. After almost 50 years, the expo not only changed its name by capitalising every letter (CeBIT has transformed to become CEBIT), it also changed its scheduling, opting for...

Continue reading Transformation everywhere – IBM Code at CEBIT 2018

Are You Developers? WeAreDevelopers, 2018

Earlier this month, we attended the WeAreDevelopers World Congress conference in Vienna. Named Europe’s largest playground for developers, founded as recently as 2015, the Congress has truly grown from strength to strength. This year, from May 16th – 18th there were 8,000 participants, 250+ speakers, 100+ sponsors, who all convened in Austria’s capital for 3...

Continue reading Are You Developers? WeAreDevelopers, 2018

Jax 2018 – Just An Awesome Experience

What a week! From 23rd to 27th April our Berlin team attended the Jax conference in Mainz, Germany. We had such a great time sharing our fresh perspectives, in the form of a rousing keynote and two informative sessions. The concept of this annual event with over 2,000 participants, revolves around innovating with Java, architecture,...

Continue reading Jax 2018 – Just An Awesome Experience

Related Links

Presentation

Learn about building serverless web apps with OpenWhisk.

Angular

Learn to build applications with Angular, and reuse your code and abilities to build apps for any deployment target.

IBM Cloud Functions

Learn more about this Function-as-a-Service (FaaS) platform, which executes functions in response to incoming events and costs nothing when not in use.