我正在尝试实现一个Angular 2,我需要使用InMemoryDbService和MockBackend模拟与我的服务器的连接。 我遇到了InMemoryDbService和MockBackend之间的不兼容问题。当我把它们放在一起InMemoryDbService不起作用,我只能从MockBackend提供程序获取数据。我应该只使用其中一个吗?
您有什么解决此问题的方法?
我的AppModule
---import all modules---
@NgModule({
imports: [
BrowserModule,
FormsModule,
RouterModule.forRoot(routes),
HttpModule,
LoginModule,
DashboardModule,
SignupModule,
InMemoryWebApiModule.forRoot(InMemoryDataService),
// InMemoryWebApiModule.forRoot(InMemoryDataService, { delay: 10 }),
SharedModule.forRoot()
],
declarations: [
AppComponent,
AlertComponent
],
providers: [
AppConfig,
AuthGuard,
AlertService,
AuthenticationService,
UserService,
// providers used to create fake backend
// fakeBackendProvider,
MockBackend,
BaseRequestOptions
],
bootstrap: [AppComponent]
})export class AppModule { }
假backend.ts
import { Http, BaseRequestOptions, Response, ResponseOptions, RequestMethod } 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: function(backend: MockBackend, options: BaseRequestOptions) {
// 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.email === params.email && 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,
email: user.email,
firstName: user.firstName,
lastName: user.lastName,
token: 'fake-jwt-token'
}
})));
} else {
// else return 400 bad request
connection.mockError(new Error('Email 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 })));
}
}
// 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.email === newUser.email; }).length;
if (duplicateUser) {
return connection.mockError(new Error('Email "' + newUser.email + '" is already taken'));
}
// 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 })));
}
// 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 })));
}
}
}, 500);
});
return new Http(backend, options);
},
deps: [MockBackend, BaseRequestOptions]
};
内存-data.service.ts
import {InMemoryDbService} from 'angular-in-memory-web-api';
export class InMemoryDataService implements InMemoryDbService {
createDb() {
let user = {
firstName: "Petros",
lastName: "Kontogiannis",
email: "pkontogiannis@accelaero.com",
password: "test123"
}
return {
user
};}}