CODEWITHSUNDEEP
javascriptangularjsnode.jsauthenticationoauth
corvid
corvid

Reputation: 11207

Handling OAuth token-based authentication with Angular.js?

I have set up my back end code in Node.js to authenticate with GitHub successfully using passport. I am able to generate a token using jsonwebtoken. However, I am having trouble managing the front end because of the flow of OAuth.

If this was based on a form where they input the email and password, the view might be a bit like this:

<form ng-submit="login()">
  <input ng-model="user.email" type="email" name="email" id="email" ng-required />
  <input ng-model="user.password" type="password" name="password" id="password" ng-required />
  <button type="submit">Log in</button>
</form>

in this flow, a controller could use login() to make a request to a route and receive back an object containing the currentUser and token on success, and redirect on a callback.

The flow of OAuth is causing me some trouble here. In OAuth, you redirect the user off of the site, and it returns to a callback url on the node.js side where the currentUser is set on the server. I don't know how to connect the angular front end to this process.

In angular, how are you supposed to handle this such that clicking a "login with github" button will update $window.sessionStorage.token variable and $rootScope.currentUser object?

Upvotes: 2

Views: 418

Answers (2)

Himanshu sharma
Himanshu sharma

Reputation: 7949

I think you want to login from server site and redirect to front end .

Create an api hit which will go to server and it will populate github screen that you can use by passport-github for node.js and then when login is done it will give you data . Redirect to your server to website page with github data in the params.

and then on load of page read those params by urlparsing

Upvotes: 0

Tracker1
Tracker1

Reputation: 19344

Your oauth link should have a target of _blank, or use window.open to login in a new window... when oauth completes, you can call window.opener.foo(...) from your window's code that can notify the preceeding SPA application to update its' state...

Upvotes: 2

Related Questions