Angular 2 - encrypt password when submitting from Angular 2 to web api
I am new to Angular 2 development. In my application I have a login module that passes the username and password [Plain Text] to the web APi controller for authentication from the Angular service class.
Below is my Angular 2 service method that calls the web api.
authenticate(model) {
let headers = new Headers({ 'Content-Type': 'application/json; charste=utf-8' });
let options = new RequestOptions({ headers: headers });
let body = JSON.stringify(model);
return this.http.post('http://localhost:24314/api/Users/', body, options)
.map(response => response.json()).catch(this.handleErrorObservable);
}
Somehow I want to encrypt this password field when submitting to the api website.
Any help or suggestion would be appreciated.
Thanks in advance.
source to share
To transfer credentials to your server, send them over HTTPS; there is no need to encrypt them yourself. Sends everything to HTTPS; HTTP is no longer a reliable option today.
Credentials should not appear in your code, but must be entered by the user on a form. You get them in memory and send them to the server. Ideally, the server would exchange them for an authentication token, so you could store that token on the client (for example, in localstorage). You can then authenticate your user to the server by sending a token on every request (always on HTTPS, of course).
source to share
The best and simple aproach to encrypt a password is the javascript btoa method, you can use it like this
authenticate(model) {
let data = btoa(model.user_name + ':' + model.password);
let headers = new Headers({ 'Content-Type': 'application/json; charste=utf-8' });
let options = new RequestOptions({ headers: headers });
let body = JSON.stringify(data);
return this.http.post('http://localhost:24314/api/Users/', body, options)
.map(response => response.json()).catch(this.handleErrorObservable);
}
With which you don't need to use a third party encryption library or something like that for more information see here
source to share
authenticate(model) {
let headers = new Headers({ 'Content-Type': 'application/json; charste=utf-8' });
let options = new RequestOptions({ headers: headers });
model.pass = yourEncryptionFunction(model.pass, 'superStringPass');
let body = JSON.stringify(model);
return this.http.post('http://localhost:24314/api/Users/', body, options)
.map(response => response.json()).catch(this.handleErrorObservable);
}
yourEncryptionFunction(password: string, cryptoKey: string): string {
// .. do something here.. use a lib or just add a static value..
return ....;
}
The problem is that everyone can see your mehtod cipher and its used crypto key or whatever .. so there is no real benefit from that. :)
Interesting libraries:
source to share