From 58a675d3e430a936b2a955a4d888ba2322046e8a Mon Sep 17 00:00:00 2001 From: Dmitry Kann Date: Sun, 12 Feb 2017 19:56:17 +0100 Subject: [PATCH 1/2] Fixed missing input IDs (req. for labels) and copy-pasted validation rules --- app/login/login.component.html | 4 ++-- app/register/register.component.html | 12 ++++++------ 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/app/login/login.component.html b/app/login/login.component.html index e7441b0..cb0a945 100644 --- a/app/login/login.component.html +++ b/app/login/login.component.html @@ -3,12 +3,12 @@

Login

- +
Username is required
- +
Password is required
diff --git a/app/register/register.component.html b/app/register/register.component.html index 2a56ae5..64d4dd4 100644 --- a/app/register/register.component.html +++ b/app/register/register.component.html @@ -1,24 +1,24 @@ 

Register

-
+
- +
First Name is required
-
+
- +
Last Name is required
- +
Username is required
- +
Password is required
From 9320e25a11c42214044abc25a204e251a3c0ace7 Mon Sep 17 00:00:00 2001 From: Dmitry Kann Date: Sun, 12 Feb 2017 20:06:03 +0100 Subject: [PATCH 2/2] Converted factory from lambda into function to make it work with webpack, too --- app/_helpers/fake-backend.ts | 262 ++++++++++++++++++----------------- 1 file changed, 132 insertions(+), 130 deletions(-) diff --git a/app/_helpers/fake-backend.ts b/app/_helpers/fake-backend.ts index a9ffead..0be1443 100644 --- a/app/_helpers/fake-backend.ts +++ b/app/_helpers/fake-backend.ts @@ -1,154 +1,156 @@ import { Http, BaseRequestOptions, Response, ResponseOptions, RequestMethod, XHRBackend, RequestOptions } from '@angular/http'; import { MockBackend, MockConnection } from '@angular/http/testing'; -export let fakeBackendProvider = { - // use fake backend in place of Http service for backend-less development - provide: Http, - useFactory: (backend: MockBackend, options: BaseRequestOptions, realBackend: XHRBackend) => { - // array in local storage for registered users - let users: any[] = JSON.parse(localStorage.getItem('users')) || []; - - // configure fake backend - backend.connections.subscribe((connection: MockConnection) => { - // wrap in timeout to simulate server api call - setTimeout(() => { - - // authenticate - if (connection.request.url.endsWith('/api/authenticate') && connection.request.method === RequestMethod.Post) { - // get parameters from post request - let params = JSON.parse(connection.request.getBody()); - - // find if any user matches login credentials - let filteredUsers = users.filter(user => { - return user.username === params.username && user.password === params.password; - }); - - if (filteredUsers.length) { - // if login details are valid return 200 OK with user details and fake jwt token - let user = filteredUsers[0]; - connection.mockRespond(new Response(new ResponseOptions({ - status: 200, - body: { - id: user.id, - username: user.username, - firstName: user.firstName, - lastName: user.lastName, - token: 'fake-jwt-token' - } - }))); - } else { - // else return 400 bad request - connection.mockError(new Error('Username or password is incorrect')); - } +function fakeBackendFactory(backend: MockBackend, options: BaseRequestOptions, realBackend: XHRBackend) { + // array in local storage for registered users + let users: any[] = JSON.parse(localStorage.getItem('users')) || []; + + // configure fake backend + backend.connections.subscribe((connection: MockConnection) => { + // wrap in timeout to simulate server api call + setTimeout(() => { + + // authenticate + if (connection.request.url.endsWith('/api/authenticate') && connection.request.method === RequestMethod.Post) { + // get parameters from post request + let params = JSON.parse(connection.request.getBody()); + + // find if any user matches login credentials + let filteredUsers = users.filter(user => { + return user.username === params.username && user.password === params.password; + }); - return; + if (filteredUsers.length) { + // if login details are valid return 200 OK with user details and fake jwt token + let user = filteredUsers[0]; + connection.mockRespond(new Response(new ResponseOptions({ + status: 200, + body: { + id: user.id, + username: user.username, + firstName: user.firstName, + lastName: user.lastName, + token: 'fake-jwt-token' + } + }))); + } else { + // else return 400 bad request + connection.mockError(new Error('Username or password is incorrect')); } - // get users - if (connection.request.url.endsWith('/api/users') && connection.request.method === RequestMethod.Get) { - // check for fake auth token in header and return users if valid, this security is implemented server side in a real application - if (connection.request.headers.get('Authorization') === 'Bearer fake-jwt-token') { - connection.mockRespond(new Response(new ResponseOptions({ status: 200, body: users }))); - } else { - // return 401 not authorised if token is null or invalid - connection.mockRespond(new Response(new ResponseOptions({ status: 401 }))); - } - - return; + return; + } + + // get users + if (connection.request.url.endsWith('/api/users') && connection.request.method === RequestMethod.Get) { + // check for fake auth token in header and return users if valid, this security is implemented server side in a real application + if (connection.request.headers.get('Authorization') === 'Bearer fake-jwt-token') { + connection.mockRespond(new Response(new ResponseOptions({ status: 200, body: users }))); + } else { + // return 401 not authorised if token is null or invalid + connection.mockRespond(new Response(new ResponseOptions({ status: 401 }))); } - // get user by id - if (connection.request.url.match(/\/api\/users\/\d+$/) && connection.request.method === RequestMethod.Get) { - // check for fake auth token in header and return user if valid, this security is implemented server side in a real application - if (connection.request.headers.get('Authorization') === 'Bearer fake-jwt-token') { - // find user by id in users array - let urlParts = connection.request.url.split('/'); - let id = parseInt(urlParts[urlParts.length - 1]); - let matchedUsers = users.filter(user => { return user.id === id; }); - let user = matchedUsers.length ? matchedUsers[0] : null; - - // respond 200 OK with user - connection.mockRespond(new Response(new ResponseOptions({ status: 200, body: user }))); - } else { - // return 401 not authorised if token is null or invalid - connection.mockRespond(new Response(new ResponseOptions({ status: 401 }))); - } - - return; + return; + } + + // get user by id + if (connection.request.url.match(/\/api\/users\/\d+$/) && connection.request.method === RequestMethod.Get) { + // check for fake auth token in header and return user if valid, this security is implemented server side in a real application + if (connection.request.headers.get('Authorization') === 'Bearer fake-jwt-token') { + // find user by id in users array + let urlParts = connection.request.url.split('/'); + let id = parseInt(urlParts[urlParts.length - 1]); + let matchedUsers = users.filter(user => { return user.id === id; }); + let user = matchedUsers.length ? matchedUsers[0] : null; + + // respond 200 OK with user + connection.mockRespond(new Response(new ResponseOptions({ status: 200, body: user }))); + } else { + // return 401 not authorised if token is null or invalid + connection.mockRespond(new Response(new ResponseOptions({ status: 401 }))); } - // create user - if (connection.request.url.endsWith('/api/users') && connection.request.method === RequestMethod.Post) { - // get new user object from post body - let newUser = JSON.parse(connection.request.getBody()); - - // validation - let duplicateUser = users.filter(user => { return user.username === newUser.username; }).length; - if (duplicateUser) { - return connection.mockError(new Error('Username "' + newUser.username + '" is already taken')); - } - - // save new user - newUser.id = users.length + 1; - users.push(newUser); - localStorage.setItem('users', JSON.stringify(users)); + return; + } - // respond 200 OK - connection.mockRespond(new Response(new ResponseOptions({ status: 200 }))); + // create user + if (connection.request.url.endsWith('/api/users') && connection.request.method === RequestMethod.Post) { + // get new user object from post body + let newUser = JSON.parse(connection.request.getBody()); - return; + // validation + let duplicateUser = users.filter(user => { return user.username === newUser.username; }).length; + if (duplicateUser) { + return connection.mockError(new Error('Username "' + newUser.username + '" is already taken')); } - // delete user - if (connection.request.url.match(/\/api\/users\/\d+$/) && connection.request.method === RequestMethod.Delete) { - // check for fake auth token in header and return user if valid, this security is implemented server side in a real application - if (connection.request.headers.get('Authorization') === 'Bearer fake-jwt-token') { - // find user by id in users array - let urlParts = connection.request.url.split('/'); - let id = parseInt(urlParts[urlParts.length - 1]); - for (let i = 0; i < users.length; i++) { - let user = users[i]; - if (user.id === id) { - // delete user - users.splice(i, 1); - localStorage.setItem('users', JSON.stringify(users)); - break; - } + // save new user + newUser.id = users.length + 1; + users.push(newUser); + localStorage.setItem('users', JSON.stringify(users)); + + // respond 200 OK + connection.mockRespond(new Response(new ResponseOptions({ status: 200 }))); + + return; + } + + // delete user + if (connection.request.url.match(/\/api\/users\/\d+$/) && connection.request.method === RequestMethod.Delete) { + // check for fake auth token in header and return user if valid, this security is implemented server side in a real application + if (connection.request.headers.get('Authorization') === 'Bearer fake-jwt-token') { + // find user by id in users array + let urlParts = connection.request.url.split('/'); + let id = parseInt(urlParts[urlParts.length - 1]); + for (let i = 0; i < users.length; i++) { + let user = users[i]; + if (user.id === id) { + // delete user + users.splice(i, 1); + localStorage.setItem('users', JSON.stringify(users)); + break; } - - // respond 200 OK - connection.mockRespond(new Response(new ResponseOptions({ status: 200 }))); - } else { - // return 401 not authorised if token is null or invalid - connection.mockRespond(new Response(new ResponseOptions({ status: 401 }))); } - return; + // respond 200 OK + connection.mockRespond(new Response(new ResponseOptions({ status: 200 }))); + } else { + // return 401 not authorised if token is null or invalid + connection.mockRespond(new Response(new ResponseOptions({ status: 401 }))); } - // pass through any requests not handled above - let realHttp = new Http(realBackend, options); - let requestOptions = new RequestOptions({ - method: connection.request.method, - headers: connection.request.headers, - body: connection.request.getBody(), - url: connection.request.url, - withCredentials: connection.request.withCredentials, - responseType: connection.request.responseType + return; + } + + // pass through any requests not handled above + let realHttp = new Http(realBackend, options); + let requestOptions = new RequestOptions({ + method: connection.request.method, + headers: connection.request.headers, + body: connection.request.getBody(), + url: connection.request.url, + withCredentials: connection.request.withCredentials, + responseType: connection.request.responseType + }); + realHttp.request(connection.request.url, requestOptions) + .subscribe((response: Response) => { + connection.mockRespond(response); + }, + (error: any) => { + connection.mockError(error); }); - realHttp.request(connection.request.url, requestOptions) - .subscribe((response: Response) => { - connection.mockRespond(response); - }, - (error: any) => { - connection.mockError(error); - }); - }, 500); + }, 500); + + }); - }); + return new Http(backend, options); +} - return new Http(backend, options); - }, +export let fakeBackendProvider = { + // use fake backend in place of Http service for backend-less development + provide: Http, + useFactory: fakeBackendFactory, deps: [MockBackend, BaseRequestOptions, XHRBackend] -}; \ No newline at end of file +};