Google Yolo and Spring Boot 2.0 Authentication

Back in 2016, Google announced the “Open Yolo” project: You Only Login Once. It originally seemed to be an Android library but during Google’s last Dev Summit in October 2017, Google released “One-tap Sign-ups On Websites and API Integrations” which brings Google Yolo to your website via JavaScript goodness. There’s a very easy guide that will have you up and running in no time here:

We used React to quickly setup a prototype of how the flow works, and you should hopefully end up with something that looks like this after following the guide above:


And, once you login, you’ll end up being issued a token, which would look something like the following:

eyJhbGciOiJSUz [ … ] 52BVk4nS9ReGWOe8A

The Google guide then proceeds to use the above token in a function they call


In this article we’ll explore what happens (or at least one way of what happens) once you are given that token. We’re looking at it from the point of view of the back-end, and we assume that as a backend engineer you have no control or say over how this Google Yolo token is generated, you just receive this token in your REST API requests and need to figure out how to integrate the Yolo token so that only those clients who present a valid Google Yolo token are allowed access to the REST API. To make it a bit more interesting, let’s define the following rules:

  • Any user with a valid Google Yolo token will be allowed to query the REST API

– however –

  • Any some authorized users with a valid Google Yolo token will be allowed to access sensitive parts of the API

In this case, the backend is written using the just released Spring Boot 2.0 framework – specifically using the MVC framework. For the sake of brevity we assume the REST API endpoints, controllers, and so on are already up and running and now we need to integrate the Google Yolo authorization scheme outlined above.

Our scenario is slightly different from a full blown OAUTH2 implementation, so it’s best to outline the workflow:

Our conceptual Google YOLO + Spring Boot authentication workflow

We already outlined how the frontend would achieve steps 1 & 2, so we turn our attention to the remaining steps. In step 3, the frontend needs to request some resources from our API. Without a valid token, the REST API will return an HTTP 403 FORBIDDEN.

(Sidenote: I realize there are lots of other ways to do this – like using a database, or a service like Firebase… it all depends on your architectural needs)

In this case, the backend API requires its own token (which is shared with the rest of the infrastructure) – so we somehow need to translate the Google YOLO token to a token which our infrastructure will understand. So, in step 3 the frontend the frontend sends a POST request to the url /googleToken. The job of this endpoint is to validate the Google YOLO token (step 4 – which is outlined in Google’s guide we linked to above). and if valid, create and return it’s own valid token. We’ve decided to go with JSON Web Tokens [JWTs] in this project. There’s plenty of good resources out there outlining JWT awesomeness (in particular by Auth0), but in a nutshell what drew us to JWT is:

  • We don’t ever need to know a user’s password – we just need to know a client ID
  • JWT is JSON based – so lots of support
  • JWTs can be cryptographically signed and verified as an anti-tamper measure
  • JWTs have in built expiry
  • JWT have built in “claims”, a.k.a. user permissions / roles

Since JWTs basically encode user identity, permissions, and expiry into one JSON blob, JWT makes it incredibly easy for your application to be stateless.

Step 4 is all about being able to issue API JWTs to users who present a valid Google YOLO token. Below is how /googleToken could be coded as a Spring @RestController, named SecurityController:

Most of the code is fairly standard Spring code – however pay special note to lines 70-74 which as the comments explain, are a trivial implementation of the authorization part of our code. If the user’s email (extracted from the secure Google YOLO token) matches an authorized user, we add an extra “claim” to JWT (called “ACTUATOR” in our case). As we’ll see later, claims are analogous to Spring Security Authorities.

In the above code snippet, we see reference to “TokenCreator”, which handles the creation of our API JWT token – step 5 in our workflow. Below is an example of the implementation of TokenCreator, which is a Spring Service responsible for building, signing and issuing the API JWTs. We use auth0 JWT library [com.auth0.jwt.JWT] to actually do the heavy lifting of signing and creating the JWT

Note how:

  • Line 31: we can specify when a JWT will expire (and so not be valid anymore)
  • Line 36: we specify an “issuer” which we can then check later to validate the JWT
  • lines 44-46: we add all the claims the user will have into the token.

At this point we can issue JWT to our frontend, but now we need to use Spring Security so that we can authenticate and authorize those users with valid API JWTs. First, we configure Spring Security

Below is an example of a Spring Boot Security configuration to accomplish this.

Note the following:

  • We use multiple Spring Security configurations, ordered using the @Order annotation.
  • Line 14: The first WebSecurityConfigurerAdapter allows all requests to /googleToken since this is the endpoint clients will use to get their tokens issued in the first place
  • Lines 35-36: The second WebSecurityConfigurerAdapter ensures that all requests to the sensitive part of our API (urls beginning with /actuator) have the ACTUATOR authority while the other URLs are permitted to all users which have a valid API JWT

In order to verify that a user has a valid API JWT, in the above snippet (line 32) we added a new Spring Security filter called “JWTFilter” which is in charge of extracting the JWT from the HTTP Authenticate header, validating the JWT signature, and translating JWT claims to Spring Security Authorities.

( TIP: this was a bit counter-intuitive to me, but even if you are not using Basic Authentication in your app, you have to include your new filter (JWTFilter in our case) after BasicAuthenticationFilter.class as shown in line 32 above.

Also, even though line 36 says “permitAll”, the requests still need to pass through the filter, which can return an error if the JWT token is invalid as we’ll see below)

The implementation of the Spring Security Filter which we called JWTFilter follows. Again we use the auth0 JWT library to do the heavy lifting of validating our token and extracting the claims:

Note the following:

  • Lines 34-37: we build a JWT verifier using the same issuer we used before, to verify and decode all incoming JWT
  • Line 38: we extract the “API_ALLOWED” claim and if false, we send an HTTP 403 FORBIDDEN (lines 70-72)
  • Line 41: we extract the “subject” – a.k.a. the user ID (which originally came from Google YOLO)
  • Lines 43-46: we extract the claims from the JWT and convert them into Spring SimpleGrantedAuthority
  • Lines 48-50: these Authorities are then passed into a UsernamePasswordAuthenticationToken which is subsequently used to update the Spring Security context via

    in line 52

  • Lines 67-68: only if the JWT is verified does the filter allow the request to complete

That pretty much handles our entire workflow, while allowing us to explore:

  • how to map one token (Google Yolo) to another (API JWT)
  • the relationship between JWT “claims” and Spring Security “Authorities”
  • Using Spring Security to validate and authorize users based on JWT

Notes on Google Firebase Cloud Messaging

I’m a huge fan of Firebase, so I’m very excited that Google Cloud Messaging [GCM] has been re-branded Firebase Cloud Messaging [FCM], which can be used for cross platform messaging.


It’s actually very simple to set this up on Android and IOS, but what’s more interesting is the web client. I was really hoping things got eaier in this department. Unfortunately, right off the bat when checking out FCM web messaging nothing much has changed yet, the FCM site provides a link to the older (but excellent) codelab which details how to implement this using service workers and the HTML5 Push API. 


The problem is the Push API is a very quickly evolving standard with plenty of activity revolving around it, and the above article does an excellent job of describing the nuts and bolts of it all, but leaves out some important information that would drive more widespread Push API adoption IMHO:


  • Which libraries are available to simplify the process?

I’m not discouraging anyone from trying this, it’s actually pretty easy, but there are quite a number of steps involved, as we can see below, not counting encrypting and sending Push API payloads:


Surely there must be some libraries to help us out?

Let me try to address these two issues with some notes from research I’ve done so far (suggestions for avenues of research are welcome!! see my contact page to contact me).

Frontend libraries

There isn’t too much to write about here. The most promising one I’ve found that automates registering the service worker and handles a lot of the background work for the Push API is Google’s own “Propel” library. It’s very simple to implement as you can see from the readme, and only requires some minimal manual work like getting an FCM/GCM key, adding a manifest and a minimal service worker file.

While the library does handle the service worker registration and subscription side of things, it doesn’t do anything (yet) to help with actually displaying the notifications. I suspect this is going to change very soon, it just needs to be documented properly. That being said, adding notifications manually to the service worker file is trivial.

All in all, the library definitely helps in getting you on your feet quickly and with less trouble

Custom Push data payloads and associated backend libraries

Ok, so we have push notifications working, but we want to send custom Push data payloads. As we previously mentioned, the payload needs to be encrypted before it’s sent to the client, meaning not even FCM would know what data is being passed through the data payload.

There are some excellent examples of how to achieve this in Mozilla’s service worker cookbook:

In those examples they use Marco’s web-push npm library for NodeJS. This works across Chrome and Firefox. There’a similar NPM library provided by Google themselves (web-push-encryption):

For the python lovers, we can use Mozilla’s pywebpush library:

Here’s a troubleshooting tip: almost all the libraries require you to send the endpoint subscription details to your server. The aforementioned Propel library shows an example of how to do this on their README. The above mentioned backend databases then use this information (which is basically a URL describing which endpoint to send the Push to, and two public keys that are used to encrypt the data). But, with the exception of Google’s we-push-encryption library, I was being returned with an HTTP 400 error: Unauthorized Registration. 

Weird, especially when the data I passed into all libraries was the same. Looking at the code from the web-push-encryption library, it seems that google is in a transition phase and while Chrome returns an endpoint similar to this:


We actually need to change the endpoint URL to something like:


Note the difference in URLs. In the web-push-encryption library they simply replace the string, so until Chrome starts returning the new endpoint you need to do this manually.

Once this is done, you can send custom payloads via Push and read that custom data via a call to:


In the service worker file, under the ‘push‘ event listener.

UPDATE: regarding the above idiosyncrasy, got an update from a Chrome dev: