I have an Angular JS front end app that is separately deployed at http://localhost:9002 and a Play Scala back end deployed at http://localhost:9000
I want to expose a RESTful URL from the backend like http://localhost:9000/authenticate/twitter which redirects the user to the Twitter oAuth app asking them to login with their Twitter details.
I then want to redirect back to the Angular front end app and be able to call any other backend REST urls I have secured with the Twitter auth login.
I am wondering how to 'redirect' the user to the Twitter auth login page without losing my current angular state. I.e. could I do this in a pop-up and if so, then how? And how do I return from the oAuth login and store the user session info in the backend as well?
The best thing for me would be to pass the twitter login details to the backend and have the backend call the twitter auth stuff and store a user session there, then just give the front end a token it can use for each auth request, but the whole redirect to Twitter login page ruins this. Any ideas for how to implement what I want?
This is definitely doable as I've done it before (sorry no example - commercial code)
I assume you can open twitter in popup so I won't write code for it
main window
js
window.DaSecretBirdy = function (token) {
//do something with token
}
popup
open twitter auth page, set redirection to a custom page
on a custom page get the twitter token from a query string and call
js
window.opener.DaSecretBirdy(hereIsMyToken)
that's the concept that is working, keep in mind that you will need angularjs $apply if you want to assign variable on scope from external code
Related
I have two separate apps, a Rails only API and a react App. I am trying to authenticate the user with a link in an email (which has a token).
What I have so far is:
1 In the React App, user presses a login with fb button, which logs in with fb.
2 With the fb response, I send a request to Rails API and I save the user in the Rails API database.
3 In the Rails API, after that, I send an email to the user so that he can click a link with the token
4 User clicks the link in the email and Rails API receives this request with the token, and activates user in the database.
Now comes my question. Since it's an api, I can not respond with an html page saying, now you are authenticated, please login again or sth.
What should I do?
1) Is there a way from an API to send the user to a react URL? I mean, that the user goes to a page of my React App
2) Should the Rails API generate the link with token, but based on the React domain, and once the user clicks the link in the email, somehow go to the react app, and not to the rails api, and then from the react app, send the request to the rails api with this token? this way, when Rails Api response, I can navigate with React to another page because I am in the React app
The confirmation of the email looks like this:
resources :users, only: [] do
member do
get :confirm_email
end
end
and the action does this at some point, after having found the user:
def email_activate
self.email_confirmed = true
self.confirm_token = nil
save!(:validate => false)
end
And the link in the email looks like this:
<%= confirm_email_user_url(#user.confirm_token) %>
I don't have any knowledge of rails but here's a generic answer.
I would create a UI for your activation page in your react app. The url could be as follows: myreactapp.com/activate?token=<insert_activation_token_here>.
This path will serve a nice UI. Either on the front-end or back-end of this path (whichever more convenient), you can communicate with your API and pass on the token. The url could be as follows: myapi.com/activate?token=<token_from_react>.
This page could show a success or failure screen or whatever you like after receiving a response from the API.
Edit: This seems like a more architectural and subjective question so there's probably a wide variety of solutions.
I am using laravel and AngularJS for development.
I have different portals and login page but login function is same to login all users at back end.
I want to check source URL before hitting to login function if URL is hitting from right portal to right user then it should proceed to application further other wise not.
If you wanna check the url then you can use $location provided by angular to see the url before sending the request.
According to this link: http://www.django-rest-framework.org/tutorial/4-authentication-and-permissions/#adding-login-to-the-browsable-api
I need to add the following code to my URLs.py:
url(r'^api-auth/', include('rest_framework.urls',
namespace='rest_framework')),
When I added this, users can log in by going to the "api-auth" URL and using the default DjangoRestFramework login interface. After a successful login, users are directed to "/test" because I have the following code in my settings.py:
LOGIN_REDIRECT_URL = '/test'
I wanted a way for users to be able to log-in using my own custom interface but by using DjangoRestFramework's built-in code for logging users in, so I created my own template. The login form in the template sends a post request to
api-auth/login/
and sends the user object (which consists of a username and password in JS) along with the POST request. No errors are returned, so I'm assuming the login is successful. However, it does not redirect to any URL (I was expecting it to redirect to "/test").
Any idea why it does not redirect anywhere, and how I can make it redirect to "/test"?
Edit: I am also using AngularJS on the frontend.
LOGIN_REDIRECT_URL is basically from django.contrib.auth so I wouldn't except other auth backends to use it, at least not necessarily/automatically
Also if you're logging through REST say from an AngularJS, even if after the REST API login is successful and returns a redirect response, there is no guarantee that the AngularJS app will navigate to that page because the login REST API was hit using an XHR request (from $http or $resource etc)
I'm using a slightly different REST auth lib than you, called django-rest-auth (not the BrowsableAPI that comes with DRF), I'm authenticating from AngularJS, and after the call is done with success, I simply navigate the app to a new URL
djangoAuth.login(username, password).then(function(){
// make angularJS navigate to new page when login is successful
// $location.path(...) or some other way
});
Bottom line is, since you have an auth API, you can make a small AngularJS page, with login form, then when login is successful redirect with AngularJS
Worth a look
I'm using these two libs that are meant to be used together, they offer REST auth over DRF, and optional a AngularJS lib to help with the frontend
https://github.com/Tivix/django-rest-auth
https://github.com/Tivix/angular-django-registration-auth
I want to conver my existing site to angularJS application. Its flow is like this.
My parent web site is having link to sign up or login page.
As per user selection signup or login page should open.So once user login or created account he pointed to dashboard page.So how to do this angularJS?
Please note my parent web site is not in angular.
Thanks in advnce.
Here is a suggested design and here is a little project I wrote that has Angular code authenticating with a PHP server. The code has both the Register and Log in options you are looking for.
Use token based authentication (Im assuming your angular requests are JSON)
After the user logs in or registers, send a bearer token back to Angular via the URL. On the server side set an expiry date for the token
Every http request you make can include the token in the http header
The sample code has this implemented.
How do I add logout functionality to my angular app. I currently have a cookie(ngcookies) containing the saml-token, which is used to authenticate the app to the REST backend.
I have tried to just delete the cookie from the browser to test if this is enough to end a session, but it is somehow replaced. Is it angular that cache it and replaces it?
What else do i need to do to logout?