We are running a typical MEAN setup - Angular for the frontend rendering, node.js (express) as server. Static HTML/Javascript assets are served from node without requiring authentication. All data displayed in the frontend is requested by Angular from node. Angular authorizes the user against the node endpoints by supplying a bearer JWT token in the "Authorization" header of the ajax requests.
This works perfectly, but I am at a dead end when it comes to Google API OAuth2 integration in this setup. The goal is to display a user's calendar data in the webapp:
Problem is step 4 - as the node server is stateless and the redirect from Google to /api/calendars/googleCallback?code=XYZ does not contain an Authorization header the server can not identify let alone authenticate the user the provided access code belongs to.
Dynamically adding some sort of hash identifying the user to the callback URL does not work (and seems quite unsafe anyway) as Google only accepts pre-specified fixed callback URLs. I could store user-identification in a cookie but this feels like violating the overall JWT approach.
Question would be if the flow described above is in general a bad idea or if there are best practices to deal with this situation to allow the backend to identify which user the request to a callback belongs to.
Thanks!
Alright - overlooked the straightforward solution:
Use a state param in the token-query which Google routes through and appends to the callbackurl: https://developers.google.com/accounts/docs/OAuth2Login#state-param
In node:
var googleApi = require('googleapis');
var oauth2Client = new googleApi.auth.OAuth2(config.clientId, config.clientSecret, config.callbackUrl);
var options = {
access_type: 'offline',
state: 'hashed-useridentified',
scope: [
'https://www.googleapis.com/auth/calendar.readonly'
].join(' ')
};
oauth2Client.redirectUri_ = 'http://someserver.com/api/auth/google/calendar/callback';
var generatedUrl = oauth2Client.generateAuthUrl(options);