1

I'm trying to make a simple application using Aurelia, and I don't like that my routes are matching urls with extra content on the end.

My router configuration is:

configureRouter(config, router) {
  config.title = 'Aurelia';
  config.map([
    { route: '', redirect: 'players' },
    { route: 'players', name: 'players', moduleId: 'components/players/players', nav: true, title: 'Players' }
  ]);
  this.router = router;
}

I only want #/players to route to the players component. How can I keep things like #/players/extra/url from also being routed?

user3885964
  • 55
  • 5
  • can you fork this gist.run and create a minimal repro of your setup. https://gist.run/?id=8ae06845f2bdf4d533b072c00da82614 it should work as you expect it to. It is hard to tell not seeing what else is in play – Alexander Taran Mar 10 '18 at 23:46

1 Answers1

4

That's kind of how route-recognizer works. It stops looking at the remainder of the url once it finds a fully matching leaf route. In contrast, if you had another route #/players/foo for example, then #/players/extra would give you an error Route not found: extra.

With that in mind, you could add an additional route config with a child route matcher to catch the extra parts:

{ route: 'players/*path', redirect: 'players' }

Then, anything the user adds after #/players/ will simply be removed and they'll still end up at that page.

Be careful though with this sort of thing as it will break any child routes you might have and it might not be the behavior users expect. Even here on stack overflow you can add /extra/stuff in the address bar and you land on the same page.

Fred Kleuver
  • 7,797
  • 2
  • 27
  • 38
  • Thanks, this seems the right solution, though I route to a not-found page rather than redirect. That's interesting about extra things in url on stackoverflow - I was worried it would be bad style to have multiple URL's to the same page. – user3885964 Mar 12 '18 at 08:33
  • Nah it's not bad style, though I agree it can feel a bit ugly. Most client-side route recognizers are some form of `Nondeterministic Finite Automata` and they all work roughly the same way (if you're interested: http://www.nathanhammond.com/route-recognizer). Ultimately having multiple urls to the same page only improves accessibility. – Fred Kleuver Mar 12 '18 at 08:43
  • The approach is exactly right. I think the cause is slightly different, though. Aurelia lazy loads child routers, so once it finds a partially matching leaf route, it forwards the rest of the route to the child router, even if none exists. I don't think there's a good way around that at the moment. – Matthew James Davis Mar 17 '18 at 07:41
  • @MatthewJamesDavis Isn't my description of the cause simply incomplete rather than incorrect? I'm trying to fully understand it now. So: `route-recognizer` stops looking at the remainder of the route once a match is found. It ignores `extra/url` and lets any child router's `route-recognizer` handle that. The page is loaded, no `configureRouter()` is present; no router or route-recognizer gets configured, and so the `extra/url` is simply not handled by anything and effectively gets ignored. Is this correct? – Fred Kleuver Mar 17 '18 at 12:40