Angular 2: несколько служб HTTP

#angular

#angular

Вопрос:

Мы используем Angular 2 в наших проектах. До сих пор мы используем in-memory-web-api в нашей службе данных в разработке:

app.module.ts:

 imports: [
    HttpModule,
    InMemoryWebApiModule.forRoot(MockData),
    ...
]
  

data.service.ts:

 constructor(private http: Http) { }
  

Теперь пришло время получить некоторые реальные данные. Однако мы не можем заменить все фиктивные данные сразу. Как мне настроить мою службу данных на что-то вроде:

 constructor(private fakeHttp: FakeHttp, /* this one use in-memory-api */
            private http: Http /* this one goes to real remote server */) { }
  

значит, мы можем постепенно удалять фиктивные данные по мере продвижения проекта?

Ответ №1:

Вместо того, чтобы пытаться сделать это уродливое «два HTTPs», angular-in-memory-web-api предоставляет несколько вариантов.

Начиная с версии 0.1.3, существует свойство конфигурации для пересылки всех вызовов не найденных коллекций в обычный XHR.

 InMemoryWebApiModule.forRoot(MockData, {
  passThruUnknownUrl: true
})
  

Что это сделает, так это перенаправит любой запрос, для которого он не может найти коллекцию, на реальный XHR. Таким образом, один из вариантов — просто постепенно удалять коллекции из базы данных в памяти, как требуется.

 class MockData implements InMemoryDbService {
  createDb() {
    let cats = [];
    let dogs = [];
    return {
      cats,
      // dogs
    };
  }
}
  

Как только вы удалите dogs коллекцию из базы данных, in-memory теперь будет пересылать все запросы dog на реальный сервер.

Это всего лишь исправление уровня сбора. Но если вам нужен еще более детальный контроль, вы можете использовать перехватчики методов.

Допустим, в вашем MockData классе вы хотите переопределить get метод, просто добавьте его в MockData класс с HttpMethodInterceptorArgs аргументом.

 class MockData implements InMemoryDbService {
  get(args: HttpMethodInterceptorArgs) {
    // do what you will here
  }
}
  

Структура HttpMethodInterceptorArgs выглядит следующим образом (просто чтобы у вас было представление о том, что вы можете с этим сделать)

 HttpMethodInterceptorArgs: {
  requestInfo: {
    req: Request (original request object)
    base
    collection
    collectionName
    headers
    id
    query
    resourceUrl
  }
  passThruBackend: {
    The Original XHRBackend (in most cases)
  }
  config: {
    this is the configuration object you pass to the module.forRoot
  }
  db: {
    this is the object from creatDb
  }
}
  

В качестве примера, вот как это выглядело бы, если бы вы просто пересылали все запросы get

 get(args: HttpMethodInterceptorArgs) {
  return args.passthroughBackend.createConnection(args.requstInfo.req).response
}
  

Комментарии:

1. Круто! Именно это я и ищу. Спасибо!!