Authenticate client-side app to REST API using CORS with local strategy
angularjs, javascript, node.js
Solution
I'm working on an app with a pretty similar architecture though the services are .NET Web API rather than Node and we're using DotNetOpenAuth for the OAuth provider. Rather than the hybrid approach you're suggesting we're doing the following:
- x.com serves up a login page
- login page POSTs back credentials to x.com
- server side logic at x.com combines client_id and client_secret with the credentials to submit a token request (resource owner password credentials grant that you've mentioned above) receiving back both a temporary access token and a refresh token
- the refresh token is encrypted into a cookie issued by x.com
- both the cookie (with encrypted refresh token) and the temporary access token are then sent to the browser
- the client app (angular in my case) can now use the access token to hit api.x.com for services (It appears you're well aware of the limitations of CORS... we hacked a version of angular's $resource to facilitate this but it wasn't pretty since we wanted to use all HTTP verbs and support IE9)
- when the access token expires, the client side app can request a new access token from x.com
- server-side, x.com decrypts the cookie to get at the refresh token and issues another oauth call for a new access token
This is fairly high-level but hopefully gives you a sense for how to tackle your situation. In my case, and it appears in yours, we didn't want to use session state or a database to store the refresh token but obviously exposing that to the browser introduces security concerns so the encryption of the refresh token is important (among other security considerations) and the use of the cookie eliminates the need for session state or other persistent storage on x.com.
Problem
The Problem: Serving a secure API to a client side app using only a local authentication strategy. The red arrows are part of the knowledge gap. Context: That is --- `client.example.com` is making a POST to `api.example.com/login` where on success `client.example.com` can gain access to a GET service like `api.example.com/secret`. An idea! Implimentation of OAuth 2.0 with hybrid grant type sitting in front of API. Why hybrid? It wouldn't be an `Implicit Grant Flow` aka `Client-Side Web Applications Flow` because there is no redirection to API server too grant access token. (i.e.) "Is it ok for so-and-so to access your data?" It wouldn't be a `Resource Owner Password Flow` because a Client ID and Client Secret are passed along with the request so it's assumed the client app is server-side. OK... so what about a little bit of both? What if we used a CRSF token on page load of client-side app, and POST it with user credentials too OAuth 2.0 authentication endpoint to exchange for access token? You would authenticate each subsequent request with the access token and CRSF token after a successful login. A good Node.js OAuth 2.0 library I found: https://github.com/ammmir/node-oauth2-provider Help Me! I can not find a working example of an authentication measure that solves this problem! Point me in the right direction? Ultimately, the goal here is too authenticate a client side app to a REST api using CORS with a local strategy --- i.e. username & password --- even if the convention above isn't possible. To Accommodate Bounty: This is a client side app, so let's stay trendy. I'm looking for a working example using the Node.js OAuth 2.0 seed above for the API/Auth server and a front end framework like Angular.js or Backbone.js to make requests. The example should match the context described above.