Using Base64 encoding in Angular 4

Question

I want to send the username and password to the server using Base64 encoding.

I found that I can import the following module using npm:

    npm install --save angular-base64

I have verified that following folder is created in my project foler: node_modules\angular-base64

In my component.js file I tried to use any of the following line to import the component:

    import 'angular-base64/angular-base64'; 

It does not complain about the importing but when I try to use following line:

    headers.append('Authorization', 'Basic ' + base64.encode('username:temppass'));

It says "Can not find base64".

Answer 1

You don't really need an external library for that purpose.

The WindowOrWorkerGlobalScope.btoa() method creates a base-64 encoded ASCII string from a String object in which each character in the string is treated as a byte of binary data.

Use the btoa() function to encode:

console.log(btoa("username:temppass")); // dXNlcm5hbWU6dGVtcHBhc3M=

To decode, you can use the atob() function:

console.log(atob("dXNlcm5hbWU6dGVtcHBhc3M=")); // username:temppass

See the list of supported browser here