How to securely handle login using AngularJS

Question

I am new to Angular. I am developing a simple login form in which the entered username is compared with the username returned from the JSON request. If a match is found, the login is processed.

I feel like I am doing this, it is unsafe, am I right in thinking that the returned JSON string can be accessed through the browser console?

In the near future I will add a password to verify the password, as soon as I understand how to do it correctly.

I would like to point in the right direction to the issue of user login in Angular way.

app.js

angular.module('userApp', ["ngResource"]). config(['$routeProvider', function($routeProvider) { $routeProvider. when('/login', {templateUrl: 'partials/login.html', controller: LoginCtrl}). when('/loggedin', {templateUrl: 'partials/user-admin.html', controller: UserCtrl}). otherwise({redirectTo: '/login'}); }],[ '$locationProvider', function($locationProvider) { $locationProvider.html5Mode = true; }]). factory("User", function($resource) { return $resource("users/:userId.json", {}, { query: {method: "GET", params: {userId: "users"}, isArray: true} }); }); 

controllers.js

 function LoginCtrl($scope, $route, $routeParams, $location, User) { $scope.users = User.query(); $scope.loginUser = function() { var loggedin = false; var totalUsers = $scope.users.length; var usernameTyped = $scope.userUsername; for( i=0; i < totalUsers; i++ ) { if( $scope.users[i].name === usernameTyped ) { loggedin = true; break; } } if( loggedin === true ) { alert("login successful"); $location.path("/loggedin"); } else { alert("username does not exist") } } } 

Answer 1

Yes, you are right - it is not safe . NEVER do such things:

• NEVER save simple passwords in the database (for example, "my_password_123"
• NEVER return any sensitive information to the client and do secret computing in JavaScript
• NEVER use a simple password comparison ( providedPassword == stored password ) in the server or client code
• NEVER use an insecure (http) layer - use secure (HTTPS) instead

The correct way to do this is:

• Generate a password hashing value to save it in the database. Be sure to use a strong hashing algorithm and salted passwords. At the time of writing this answer, SHA-256 would be enough, but be sure to check if everything is considered safe.
• The wire is an SSL certificate to support HTTPS, so no one will track what the user sends to your server.
• The user enters username+password and sends them to your code on the server. On the server, you calculate the SHA-1 hash and compare it with the stored value in the database. Then you send the authentication result to the client and save it to the server using a persistent session.

Please keep in mind that most of this material is implemented by some security systems, such as Spring Security . I would not recommend doing all this from scratch, as the security topic is extensive, and it is easy to make a mistake that could be exploited by malicious users.