Fixed issue with credentials that have special chars

src/app/core/auth/auth.service.ts

@@ -1,12 +1,17 @@
 import { Inject, Injectable } from '@angular/core';
 import { PRIMARY_OUTLET, Router, UrlSegmentGroup, UrlTree } from '@angular/router';
+import { HttpHeaders } from '@angular/common/http';
+import { REQUEST } from '@nguniversal/express-engine/tokens';
 
+import { RouterReducerState } from '@ngrx/router-store';
+import { Store } from '@ngrx/store';
+import { CookieAttributes } from 'js-cookie';
 import { Observable } from 'rxjs/Observable';
 import { map, withLatestFrom } from 'rxjs/operators';
 
 import { Eperson } from '../eperson/models/eperson.model';
 import { AuthRequestService } from './auth-request.service';
-import { HttpHeaders } from '@angular/common/http';
+
 import { HttpOptions } from '../dspace-rest-v2/dspace-rest-v2.service';
 import { AuthStatus } from './models/auth-status.model';
 import { AuthTokenInfo, TOKENITEM } from './models/auth-token-info.model';
@@ -14,16 +19,9 @@ import { isEmpty, isNotEmpty, isNotNull, isNotUndefined } from '../../shared/emp
 import { CookieService } from '../../shared/services/cookie.service';
 import { getAuthenticationToken, getRedirectUrl, isAuthenticated, isTokenRefreshing } from './selectors';
 import { AppState, routerStateSelector } from '../../app.reducer';
-import { Store } from '@ngrx/store';
-import {
-  CheckAuthenticationTokenAction,
-  ResetAuthenticationMessagesAction,
-  SetRedirectUrlAction
-} from './auth.actions';
-import { RouterReducerState } from '@ngrx/router-store';
-import { CookieAttributes } from 'js-cookie';
+import { ResetAuthenticationMessagesAction, SetRedirectUrlAction } from './auth.actions';
 import { NativeWindowRef, NativeWindowService } from '../../shared/services/window.service';
-import { REQUEST } from '@nguniversal/express-engine/tokens';
+import { Base64EncodeUrl } from '../../shared/utils/encode-decode.util';
 
 export const LOGIN_ROUTE = '/login';
 export const LOGOUT_ROUTE = '/logout';
@@ -90,7 +88,7 @@ export class AuthService {
    */
   public authenticate(user: string, password: string): Observable<AuthStatus> {
     // Attempt authenticating the user using the supplied credentials.
-    const body = encodeURI(`password=${password}&user=${user}`);
+    const body = (`password=${Base64EncodeUrl(password)}&user=${Base64EncodeUrl(user)}`);
     const options: HttpOptions = Object.create({});
     let headers = new HttpHeaders();
     headers = headers.append('Content-Type', 'application/x-www-form-urlencoded');

src/app/shared/utils/encode-decode.util.spec.ts

@@ -0,0 +1,10 @@
+import { Base64EncodeUrl } from './encode-decode.util';
+
+describe('Encode/Decode Utils', () => {
+  const strng = '+string+/=t-';
+  const encodedStrng = '%2Bstring%2B%2F%3Dt-';
+
+  it('should return encoded string', () => {
+    expect(Base64EncodeUrl(strng)).toBe(encodedStrng);
+  });
+});

src/app/shared/utils/encode-decode.util.ts

@@ -0,0 +1,10 @@
+/**
+ * use this to make a Base64 encoded string URL friendly,
+ * i.e. '+' and '/' are replaced with special percent-encoded hexadecimal sequences
+ *
+ * @param {String} str the encoded string
+ * @returns {String} the URL friendly encoded String
+ */
+export function Base64EncodeUrl(str): string {
+  return str.replace(/\+/g, '%2B').replace(/\//g, '%2F').replace(/\=/g, '%3D');
+}