I am currently implementing login functionality in my app. I use AngularJS and $cookieStore. I get a cookie from the server when I make an ajax request to authenticate the user. I want to use this cookie in success() to set up the user in my Auth services. I use chrome developer tools to pause right after I ask for the cookie like this:
var cookieUser = $cookieStore.get('user');
but it turns out to be undefined, but a chrome watch on unescape(document.cookie) shows a cookie "user" is set.
If I run the request twice: $cookieStore.get('user') returns the previous cookie.
Why is $cookieStore not updated with the cookie I just received?
AngularJS' uses an asynchronous $watch callback to write cookies. So you either need to wrap your cookie reading inside a $timeout, or access the data without $cookieStore.get.
I had a similar problem.
After the login was successful in my appplication I had ,of course, to transition to a state 'main.index' and in its resolve object I wasn't able to get the authentication cookie with $cookies object(angular), but I was able to see it in document.cookie.
I think $cookies are refreshed a tiny bit latter than the $.cookie that #swenedo mentioned.
Using $.cookie from jquery worked for me.
Related
I have a API server that have a POST method to login user and it stores the logged in status in session. Then after success login I have available method to get the current user information. It works well in Postman but in Angular application the second method returns that I'm not logged in. I tried with $http withCredentials flag and with angular service $cookieStore but it's still not working.
I don't know exactly how to deal with it. I don't know what should be set or stored to properly handle APIs session. Can you give me some examples?
So for the past few months I have been developing the 'login functionality' of my Angular apps like this. The user logs in and if the credentials are correct, the REST API returns a token. I take that token and store it as a cookie:
$cookies.put('authorisation', data['token']);
Whenever I call the $http service, I submit the authorisation cookie as a header and it authorises the http request. Then on the controller of each view I add:
if (!$cookies.get('authorisation')) {
$location.path('/login');
}
So if the cookie doesn't exist, the user is automatically kicked to the login screen.
This has worked for me just fine up until now but I can't help but feel that it is not the 'correct' way of doing things. Could anyone shed a little light on what the best practice method for this could be? And perhaps why what I'm doing is 'wrong'?
Are you familiar with Angular $http Interceptors:
https://docs.angularjs.org/api/ng/service/$http#interceptors
You could use the request interceptor to have your authorization checked before each $http request.
If you do this you also have to integrate a custom Flag on each $http config object (e.g. skipAuthorization) in order to allow the user to perform Requests without being logged in (useful for actually logging in ;-))
#AzzyDude to your comment:
I'm using ui-router to do the navigation inside of my Angular 1.6.X Application.
You can either integrate own config-properties on the states (isGuestState) or if its a closed application such as mine, hard-coded in a $stateChange event, like this:
I'm using AngularJS with UI-Router and am attempting to attach a query parameter to a url on all http requests across my site.
I have an OAuth system on the backend and was previously applying Authorization headers to all requests, however to preserve backwards compatibility - have discovered I will have to instead apply a url parameter with the user identification to the backend.
My issue is that, I cannot use $httpInterceptor in the config portion of the app, because at that point in the app I don't have the current User, and can't inject $http to resolve the current user because that creates a circular dependency.
I was trying to use $http.defaults.transformRequest in the run portion of the app, but that didn't seem to be able to append a parameter to the url.
Is there a way to do this short of hand writing it on every REST request across the app?
I had similar problem in my current project.
To solve the problem I manually request current user info before app bootstapping & store it in localStorage.
Then bootstrap the app & in the config section you will have accesss to current user info.
TIP: to get user info before app bootstrap you can still use $http service by manually injecting it:
angular.injector(['ng']).get('$http');
I have a problem with communication between angular and laravel.
Its about mobile application that needs to log in to a laravel framework and get some data.
Mobile application is angularjs based, and for login i user standard $httpd function.
Login works fine, and i get expected response from laravel, but when i make another request assuming that im loged in, laravel returns NULL for session and auth. When I upload mobile app to a server where laravel is installed all works like a charm. But my app needs to be on mobile device, so thats not a solution.
I assume that the problem is in cors or cross domain communication. It seems that laravel destroys session made from cross origin requests, because that session is not accessible from another request, and on another request laravel tries to make a new one.
I need help solving that session problem (access session after login or keep session), i hope some of you have some kind of a solution.
i tried :
changing headers in my login controller
changing get to post
adding content type to my angular http req (Content-Type': 'application/x-www-form-urlencoded)
tried requerst with jquery ajax
changed laravels app/config/session.php values of driver, cookie, domain...
setting vendor/laravel/framework/src/illuminate/http/frameGuard.php x-frame options to false
no luck!
Use json web tokens, and simply set it up so that you request a JWT on login, and you can share that token around - the only way it invalidates, is either if you lose the token, or it times out.
I have a angular app that I needed to redirect outside to a non angular html page, so I thought I could just use the $window.location.hrefto redirect the angular app to my external site. This actually works fine, however, I have a nodejs/express backend that checks for auth token before serving up any content(even static content).
This requires a auth token to be sent in the header of the http request. Now the question:
Can/How do you add an auth token to the request that is made by changing the $window.location.href before it is sent off?
When you use $window.location.href the browser is making the HTTP request and not your JavaScript code. Therefore, you cannot add a custom header like Authorization with your token value.
You could add a cookie via JavaScript and put your auth token there. The cookies will automatically be sent from the browser. However, you will want to review the security implications of using a cookie vs. a header. Since both are accessible via JavaScript, there is no additional attack vector there. Unless you remove the cookie after the new page loads, there may be a CSRF exploit available.
This answer is NOT a safe way, as the token is exposed in the URL, which is logged in browser history, access logs, etc. Use a domain cookie instead. I'll leave the answer as it can be an easy way to debug in your local setup.
I am using JWT as authentication on a Laravel PHP backend, and it works by putting ?token=... in the URL. For example, when using AngularJS with satellizer plug-in, I add ?token=' + $auth.getToken() to the URL.