Pet*_*erg 17 wait rxjs angular-http-interceptors angular angular-httpclient
祝你圣诞快乐.
我的Angular 4应用程序不会等待.
我希望在我调用API之前放慢速度.
但我只是继续撞墙.
我在我的代码中使用了HttpInterceptor.
但是这些Observable只会爆炸.
不要太鄙视.
下面你会发现我的尝试.
export class ApiUrlInterceptor implements HttpInterceptor {
constructor(private http: Http) { }
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
return Observable.create(observer => {
setTimeout(() => {
observer.next(true); //Not sure why I do this
const start = Date.now();
console.log(`Request for ${req.url}`);
return next.handle(req).do(event => {
if (event.type == HttpEventType.Response) {
const elapsed = Date.now() - start;
console.log(`Request for ${req.urlWithParams} took ${elapsed} ms.`);
}
});
}, 1000);
});
}
}
Run Code Online (Sandbox Code Playgroud)
结果是调用了API.
但没有安装调用者的结果
我的Observable似乎陷入困境.
我运气不好
我很清楚这是Angular中的反模式"不要等待随机数",而是构建你的应用程序,这样你就不需要了.我的实际用例是,HttpInterceptor我需要一些由其他Observable加载的东西,通常我没有麻烦,只有当用户刷新特定页面时我才有可能没有加载东西的风险.
我的直接教导"快速修复"是哎呀我做了一个如果没有加载我等待一些("给它时间加载")然后我继续,谁在乎!用户不会经常刷新该特定的角度链接.我结束了很长的路要走所有的config.ts并使用APP_INITIALIZER.但是,如果我想等待,我想知道如何等待一段时间,因此这个最小的例子.
不要绝望
相反,这里有一个眩光
import { timer } from 'rxjs/observable/timer';
// or import { TimerObsevable } from 'rxjs/observable/TimerObsevable';
export class PreRequestDelayInterceptor implements HttpInterceptor {
constructor(@Inject(PRE_REQUEST_DELAY)@Optional() private delay = 1000) { }
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
const delay = timer(this.delay);
const start = Date.now();
return delay.switchMap(()=> next.handle(req))
.do(event => {
if (event.type == HttpEventType.Response) {
const elapsed = Date.now() - start;
console.log(`Request for ${req.urlWithParams} took ${elapsed} ms.`);
}
});
}
}
Run Code Online (Sandbox Code Playgroud)
通过使用InjectionToken你可以注入固定的延迟.如果未提供,则1000将是默认延迟.
| 归档时间: |
|
| 查看次数: |
547 次 |
| 最近记录: |