Angular, JWTs and 3rd party auth - angularjs

I'm not posting any code here as I have a design problem. It may also be that I'm trying to do something that makes no sense - if so, let me know.
I have an Angular site that uses JWTs. At present I use Passport.js with a LocalStrategy. I would like to use Twitter login. I can't work out how to handle the communications.
The Passport docs envisage a situation where you go to a route on your server that redirects you to Twitter and Twitter calls back your server after it has finished, and then your server can respond to this second request (I think) with a new page and a cookie.
But I have Angular on the client side, and I can't find any tutorials for handling that. I think I could get Angular to open a window and connect to Twitter, and then I presume twitter could callback my server, but how then does my server find the Angular client to send the JWT?

I had a project that I needed to implement Facebook, Twitter and Local logins. With passport Facebook and Local were easy but with Twitter I just gave up and implemented it without passport.
I just used the Twitter API.
Very helpful was the documentation on Satellizer. It is an angular library for handle the login types in the front end, but it also have a very nice examples how to handle the logins in the different back end languages without using any third party libraries. I actually haven't used it, because I wrote all I needed myself without any third party libraries, but it helped me understand better different login APIs and how to handle them in the backend. You can check the examples here.
Hope this helps you.

Related

How do I Integrate my API with my next js?

So I'm pretty new to development, it's been like a month and a half since I started learning. So right now I'm stuck, I've got my Login API ready in spring boot which worked with postman and I've got my login page ready in next js. All I need now is when I click login it should authenticate the user details and move me to another page otherwise show something like 'invalid username/password. So how do I go about this, my js knowledge is pretty mediocre.
I would suggest starting with using a library to manage API calls,
I recommend Axios https://github.com/axios/axios.
Or Next's own library, SWR https://swr.vercel.app.
For authentication, many strategies exist, from using a JWT token to using session cookies. try searching and finding the best strategy for your app or your needs.
After that, try reading the different methods of data fetching that Next.JS offers https://nextjs.org/docs/basic-features/data-fetching/overview, you will find that each method helps to solve a certain problem, and has its own pros and cons.
Good Luck!

Node.js & AngularJS quickest and simplest way to implement authentication & authorization mechanism

I'm building a project using Node.js and AngularJS.
Some of the views and operations in my project require authorization.
In ASP.NET I used to simply save the user-id or user object in the Session when the user's credentials are correct, then in every Page and operation I would check if the user has permissions, and if not I would use Response.Redirect. So simple!
Now I use Node.js and AngularJS which are maybe the most popular combination for building websites nowadays and I would expect to have a very simple and quick way (even of a third party) to implement authorization, just like in ASP.NET.
Unfortunately I've only found a bunch of implementation examples that contain a myriad of code lines and turn me into an information security expert who knows about things like token and etc. Here are some of the articles I've found:
Best practices for authentication and authorization in Angular without breaking RESTful principles?
http://frederiknakstad.com/2013/01/21/authentication-in-single-page-applications-with-angular-js/
https://www.theodo.fr/blog/2015/08/handling-basic-route-authorization-in-angularjs/
http://code.tutsplus.com/tutorials/token-based-authentication-with-angularjs-nodejs--cms-22543
http://www.kdelemme.com/2014/03/09/authentication-with-angularjs-and-a-node-js-rest-api/
Is there any simple way to implement authentication+authorization+routing to unauthorized page without writing so many lines of code?
Any help will be profoundly appreciated!
MeteorJS is a node based framework with a drop-in authentication system. It also has first class support for AngularJS on the front-end.
You would first add the relevant accounts and UI packages on the command line.
meteor add accounts-password
meteor add dotansimha:accounts-ui-angular
You could also add OAuth provider packages such as accounts-facebook or accounts-google.
Then in your template you add a the login-buttons directive.
<login-buttons></login-buttons>
It then handles account creation, login, forgot passwords etc. It also provides hooks so you can add fields and values on account creation.
Here is a link to the authentication section of the Meteor/Angular ToDo tutorial.
nodejs modules and jsonwebtoken, passport, passport-local
passport local for local strategy and passport for authenticate and jsonwebtoken for create authentication token

Securing Symfony RESTful API consumed by angular front?

I have set up a Symfony based API which is being used by an Angular front end which is totally dependent of it (User registration included)
I have read multiple threads recommending using WSSE or FOSOAuthServerBundle but I'm not sure about the best method ?
If I understood correctly, WSSE has to send for each API request x-wsse headers which make me think it is not the best suited for performance.
About the FOSAuthServerBundle I have never used it and looks a bit complicated to me compared to WSSE, thus that's why I'm asking there before trying to implement it.
I have 2 simple groups of user (basic and admin), what would be the best way to secure my API, additionally providing an easy way to keep user persistence (I mean accesses through the different pages)?
How should it be in the Angular front side ?
Thanks for your help.
Refs: http://blog.tankist.de/blog/2013/07/16/oauth2-explained-part-1-principles-and-terminology/
http://obtao.com/blog/2013/06/configure-wsse-on-symfony-with-fosrestbundle/
It all depends on what your requirements are.
First of all, OAuth 2 is an authentication mechanism/spec which you can use in combination with sessions/bearer tokens/... This also applies for local accounts (since you want to do user registration).
FOSAuthServerBundle is a bundle to implement the server-side of the OAuth2 specification. This basically means you can expose your OAuth2 side of the API to other applications and allow them to use your accounts to authenticate. Think google login, twitter login, etc but for your own app.
This all has nothing to do with the way you validate / authorize your requests after the initial login has taken place.
Do you want to implement stateless authentication? Then I would recommend using the new JSON Web Token (JWT) specification.
See Symfony Bundle (LexikJWTAuthenticationBundle) and JWT description (JWT.io)
There are many resources on it from the angular side of things and the API part is pretty straightforward.
WSSE does not seem suited to implement in a RESTful API and I have no experience using/implementing it so I cannot comment on it too much.

Protecting API endpoint when developing two separate apps, Angular app & Laravel app

I've picked up Angular and am now developing two separate applications, the frontend, Angular app, and the backend, the Laravel app.
As of now my backend app is just an API endpoint that handles requests, database interaction, logic, validation, etc.
However, what stops someone from requesting /api/users/1 and getting that data?
Right now there is nothing in place that prevents this from occurring.
What's the best way to prevent this from occurring and verify the request is sent through the application and not through something like http://hurl.it from some random user?
You should first evaluate what routes need to be protected, and who should have access. Sometimes it might be fine to leave them open to the public.
Once you've figured that out you have a few options. I personally lean towards the oAuth 2.0 protocol. Some people find it to be over kill. Then there is also WSSE, I personally feel like today there is far better resources explaining the use of oAuth and would probably be easier to follow.
You can google around for oAuth server libraries for laravel. One such is: https://github.com/lucadegasperi/oauth2-server-laravel
You will also probably want to enable CORS if your angular app is on a different domain from your api. IE: api.example.com (holds api). And example.com is where your app lives.
For CORS laravel also has some packages, one such being: https://github.com/barryvdh/laravel-cors

Build a REST WebService with GAE using OAuth

I'm about to build a community platform from scratch. We are going to create the WebServices first and the community might have some third party components, so having solid WebServices is a good idea anyway.
Since the service is stateless we need authentication for every single call. Is it a good idea to implement the OAuth protocol for our service provider to perform this task although we are the only consumer right now?
By the way: We will deliver a mobile application before a website is launched.
The whole point of OAuth is to allow other websites (consumers) to get access to your data (you are the provider). Since you are the only consumer of your data, there is no need to implement OAuth at this stage of development.
Be lean, build something fast and put it in front of users/testers. Only at this point you will discover real bugs and get a feedback on the service so that you can improve it and steer the development in the right direction.
Note: OAuth as provided by App Engine (second paragraph) only supports users with Google Accounts (even if OpenID is used).
From my experience I created the REST WS in a authentication agnostic way: jersey methods accept everything, then there are several filters in order to validate the requests.
I used OpenId authentication for the web part, OAuth and BASIC AUTHENTICATION (with SSL) for API.
Probably it is not needed to create everything from the beginning, but remember to de-couple as much as possible your REST endpoint from the authentication: you will have a great benefit when you want to release APIs.
Last "philosophical" thing: OAuth is not totally stateless, in fact you have a temporary token that authenticates a user and it is similar to a session in the browser!

Resources