I am using Angular universal after making different modules and interceptor to handle server and browser request but home page is still loading twice. How to avoid this flicker. Here is the code I have used in interceptor
auth-interceptor.ts
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
if (request.method !== 'GET') {
return next.handle(request);
}
const key: StateKey<string> = makeStateKey<string>(request.url);
if (isPlatformServer(this.platformId)) {
return next.handle(request).pipe(tap((event) => {
this.transferState.set(makeStateKey(request.url), (<HttpResponse<any>> event).body);
}));
} else {
const storedResponse: string = this.transferState.get(makeStateKey(request.url), null);
if (storedResponse) {
const response = new HttpResponse({body: storedResponse, status: 200});
this.transferState.remove(key);
return of(response);
} else {
return next.handle(request);
}
}
}
main.ts
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
if(window){
window.console.log = function(){};
}
}
document.addEventListener('DOMContentLoaded', () => {
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.log(err));
});
