How to get an usable authentication token out of mango autologin?
-
The last thing I need for my dashboard is a working authentication. I'm planning to use mango autologin for that purpose, but couldn't figure out how use it to get a token that can be used to determine if the user is logged in and if he should be directed to the login page or the data page.
Thank you in advance for any help you can offer. This forum has really helped me a lot
-
I have not used it, so it is difficult for me to confidently answer. If I understand you correctly, you are using the object provided by autologin.js in the custom dashboards module. It looks to me like invoking the autologin returns a promise, and you can check the resolution of the promise as a sign of login or you can assign the callback function you would like to use after a login is successful or not. It looks like if you use autologin it probably makes a login request whenever it's called. The authetication token is stored in a cookie named MANGO[port] saved at the site's location, and another named X-XSRF-TOKEN, but there is no way given a session and authentication token to know if that session is valid or not without attempting access.
-
I am trying to use autologin as well. I created a new user dashboard and gave 'user' read pemissions on the points that are referenced in the extendApp.html.
If I login to mango as dashboard and then go to the extendApp.html it works. If I go straight to extendApp.html from a different browser session I get 403 Access Denied trying to access http://127.0.0.1/rest/v1/data-points/DP_299411
Seems like the autologin isn't working. the first line in extendApp.html is modified per the autologin example:
<html lang="en" ma-app="maMaterialDashboards" ma-username="dashboard" ma-password="dashboard">
Do any other lines have to be added to extendApp.html to get the autologin to work? Alternatively I would be happier to display a login page if they are not logged in, which would then proceed to the dashboard?
-
How are you bootstrapping the angular app? Do you have this line near the bottom of your HTML?
<script>require(['mango-3.0/bootstrap']);</script>
I cannot replicate your issue using v3.0.1
If you use Chrome, try opening the developer tools and see if you can find the login request on the Network tab. You should see a request to http://localhost:8080/rest/v1/login/dashboard, check the HTTP status code on the response.
-
At the bottom of the page I didn't have
<script>require(['mango-3.0/bootstrap']);</script>
I just had
<script type="text/javascript">require(['dashboards/templates/extendApp']);</script>
which was the default line in extendApp.html. I have saved extendApp.html as plot.html but otherwise left it in the same directory and it still script requires 'extendApp' as above. Seems strange .js isn't required as that is the filename but must be some magic somewhere.
Adding the require to mango-3.01/bootstrap changed things, now I see the request to /rest/v1/login. The response code is 200 OK.
Requests prior to the login had a cookie MANGO80, the login request came back with a new MANGO80 cookie and an XSRF-TOKEN. I think maybe the first go around it doesn't work because it requested /rest/v1/data-points before the login request. Hitting reload (thinking there might already by the XSRF-token set) results in successful requests to /rest/v1/data-points but after the request to rest/v1/login the next 4 requests 403 and have a different MANGO80 and XSRF-TOKEN
The Error ng:btstrpd started to appear when I added the require to mango-3.0/bootstrap.
Thanks for your help
Craig -
Ah OK, didn't realise you were working from the extendApp example. The ma-connection, ma-username, ma-password only work in conjunction with the default dashboard boostrapping file aka require(['mango-3.0/bootstrap']). If you are working from extendApp you are bootstrapping the application yourself, so you don't need to include the require(['mango-3.0/bootstrap']) line.
What you do need to do is add some code to extendApp.js that logs your user in before bootstrapping the application. Change the last part of the file from
angular.element(document).ready(function() { angular.bootstrap(document.documentElement, ['myApp']); });
To
var injector = angular.injector(['myApp']); var User = injector.get('User'); User.login({ username: 'user', password: 'password', logout: true }).$promise.then(function() { angular.element(document).ready(function() { angular.bootstrap(document.documentElement, ['myApp']); }); });