How to setup OAuth 2.0 token strategy on FeathersJS

Hi! Future me or people who need help with this. I will provide you an detailed example on how to setup the OAuth token authentication on feathersJS. I will be using google OAuth service in this case, but this can be easily adapted to other OAuth provider like Facebook or Github.

1. Register an Google OAuth account

This step is to obtain the application id and secret. So that way your FeathersJS can use the application id, secret and access token provided by the frontend to retrieve user profile data.

Go onto this link: https://developers.google.com/identity/sign-in/web/sign-in

Click on configure a project.

This screen will popup for you

Create a new project or select your existing project and then click on Next.

Select Web server and ignore the oauth2callback URI as we are using OAuth token strategy.

2. Set up backend

Install everything you need to process OAuth authentication.

npm install @feathersjs/authentication @feathersjs/authentication-oauth2 passport-google-token --save

Setup the authentication.js like this

Add the strategy name, Google client id and secret to the config/default.json and most importantly add the name of the strategy into the existing strategy array.

3. Test out the setup

Run this Github example https://github.com/00Freezy00/oauth-token-playground with npm install then npm start. I have quickly bootstrapped Google and Facebook OAuth login together for you to test it out the backend.

Place the google client id in src/App.js. Note. you need to register a new OAuth client account for website use and remember to set the callback uri otherwise you will get a redirect-uri mismatch error from google.

Login via clicking on the “login with google” button and then open the console log to view the response.

Copy the accessToken from it.

Post the request use postman on /authentication with the following payload

{"strategy":"google","access_token":"access token here"}

TA-DA!!

We got authenticated.