How do I create a catch-all route for single page apps in ASP.NET Core Razor Pages?

Question

For a single page app, we want to be able to route all otherwise-unhandled requests to the index in order to handle routing client-side.

Previously, we would add routes using MapRoute() as detailed in this answer, however, this doesn't seem to work when using a Razor Page as our index.

How do we create a fallback to a Razor Pages index?

Answer 1

In order to do this, add the route to the Razor Pages options like so:

services.AddMvc()
    .AddRazorPagesOptions(options =>
    {
        // Match all routes to the index so we can handle routing client-side.
        options.Conventions.AddPageRoute("/index", "{*url}");
    })

And then ensure that static file serving is configured as usual:

app.UseStaticFiles();
app.UseMvc(routes => {
    routes.MapRoute(
        "default", 
        "{controller=Home}/{action=Index}/{id?}");
});