Universal: Routing didn't work on SSR

[thovo]

• I'm submitting a ...

- [ ] bug report

• What modules are related to this Issue?

• Do you want to request a feature or report a bug?
  A bug

• What is the current behavior?
  The routing part didn't work on SSR by typing directly in the browser the path or click on a tag to open a new link. By example:
  The first entry route is: user, inside user click to change the route to products works normally. From products go to products/:id works perfectly. But if I type in directly in the address bar the url by example: localhost:4200/products/1 it will never find out where is the route and turn out 504 error Gateway time out.

The routing part work normally before.

• If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem by creating a github repo.
  I will try to reproduce with a clone from universal-starter later

• What is the expected behavior?
  Routing works normally

• What is the motivation / use case for changing the behavior?
  The routing works before should also work for SSR

• Please tell us about your environment:

• Angular version: 5.2.5

• Browser: all
• Language: Typescript 2.6.2
• OS: Window

• Platform: NodeJS

• Other information (e.g. detailed explanation, stacktraces, related issues, suggestions how to fix, links for us to have context, eg. stackoverflow, gitter, etc)

[MarkPieszak]

You have to make sure your Node routes are setup correctly to handle that route.
Are you manually selecting the routes /user /products to be server-side rendered?
If you are, you'll need a wildcard to handle that type of a route /products**

If you're doing app.get('*' (for everything) and getting the error - check to see if Node is throwing errors, you might have something wrong (during SSR) for that page.

One of the above is likely the culprit! Hope that helps

[thovo]

I didn't select specifically a route for SSR. Actually, I divided the route as several important routes.
user: route for only user and anything related to user, by default, redirect to user route when enter emtpy, by example: localhost:4200/

I put this line in app-routing.module.ts
{ path: '', pathMatch: 'full', redirectTo: '/user' },

products: route for everything relate to product. The route is put into a file's name is products-routing.module.ts

{
    path: 'products',
    component: ProductsAppComponent,
    children: [

      { path: '', component: ProductsComponent, outlet: 'products' },

      { path: 'products/:id', component: ProductComponent, outlet: 'products' },
    ]
}

It looks like it can't recognize the route in the products-routing.module.ts. Just only the one in app-routing.module.ts

Do you have any idea?

[Toxicable]

@thovo We're talking about the server side routes, the ones you find in your server.ts.
An example are these ones here https://github.com/angular/universal-starter/blob/master/server.ts#L39

[abhijeet1403]

I'm getting ReferenceError: XMLHttpRequest is not defined
And my HttpClientModule is only being imported in app.module.ts
I can access the home page by going to localhost:8080/index.html but not just by localhost:8080
overall universal is not working.

[jcjp]

I recently experienced this issue whenever my code hit this line this.router.navigate(['/login']); it is saying for me that router is undefined. Here is my code:

import { Injectable } from '@angular/core';
import { Router, CanActivate } from '@angular/router';
import { AuthenticationService } from './authentication.service';
import { ToastrService } from 'ngx-toastr';

@Injectable()
export class AuthGuardService implements CanActivate {
    constructor( private router: Router, private toastr: ToastrService) { }
...

I also have another issue where toastr is also undefined. If I commented out toastr, router becomes undefined and vice versa. You could see more information here: https://github.com/angular/universal/issues/1053

[abhijeet1403]

one of the library (most likely the ones u've imported in index.html) or some other library is not compatible with universal. Remove it and it should work.

[qqnc]

Does anyone encounter the the components under children are not rendered just like thovo's.

[tibinthomas]

Thanks for the help @abhijeet1403.

[TdoubleG]

Are there any new suggestions? Still have the same problem...