Resolve router on SSR #680

New Issue

fergalmoran · 2025-08-09T17:17:14Z

fergalmoran commented

2025-08-09 17:17:14 +00:00

Originally created by @ccaymaz on 6/7/2017

Hi,

I am having some issue while SSR. I added 5 seconds delay on "/api/SampleData/WeatherForecasts" and added router resolve on '/fetchdata' link.

When I hit fetchdata link from home page, I wait 5 seconds to see actual fetchdata page. Working correctly. But if I refresh my screen while I am on fetchdata page, I immediately receive content of the fetchdata page and then after 5 seconds, I get the data.

Fetchdata page should wait until "/api/SampleData/WeatherForecasts" return data. I am currently using nguniversal/aspnetcore-engine : beta-2 version for SSR.

My resolver is like that:

@Injectable()
export class FetchDataResolve implements Resolve<any> {
  
    constructor(
        private http: Http,
         @Inject('ORIGIN_URL') private originUrl: string) { }
  
    resolve(route: ActivatedRouteSnapshot) {
        return this.http.get(this.originUrl +'/api/SampleData/WeatherForecasts').map(res => res.json());
  }
}

I used it in the app.module.shared.ts like that

.......
            { path: 'fetch-data', component: FetchDataComponent, resolve: { fetchdata: FetchDataResolve} },
.......

And last one is my fetchdata.component.ts

    constructor(
        private route: ActivatedRoute) {
        this.forecasts = this.route.snapshot.data['fetchdata'] as WeatherForecast[];
    }

*Originally created by @ccaymaz on 6/7/2017* Hi, I am having some issue while SSR. I added 5 seconds delay on "/api/SampleData/WeatherForecasts" and added router resolve on '/fetchdata' link. When I hit fetchdata link from home page, I wait 5 seconds to see actual fetchdata page. Working correctly. But if I refresh my screen while I am on fetchdata page, I immediately receive content of the fetchdata page and then after 5 seconds, I get the data. Fetchdata page should wait until "/api/SampleData/WeatherForecasts" return data. I am currently using nguniversal/aspnetcore-engine : beta-2 version for SSR. **My resolver is like that:** ``` @Injectable() export class FetchDataResolve implements Resolve<any> { constructor( private http: Http, @Inject('ORIGIN_URL') private originUrl: string) { } resolve(route: ActivatedRouteSnapshot) { return this.http.get(this.originUrl +'/api/SampleData/WeatherForecasts').map(res => res.json()); } } ``` **I used it in the app.module.shared.ts like that** ``` ....... { path: 'fetch-data', component: FetchDataComponent, resolve: { fetchdata: FetchDataResolve} }, ....... ``` **And last one is my fetchdata.component.ts** ``` constructor( private route: ActivatedRoute) { this.forecasts = this.route.snapshot.data['fetchdata'] as WeatherForecast[]; } ```

fergalmoran closed this issue

2025-08-09 17:17:14 +00:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github/JavaScriptServices#680