GoRouter in Flutter not recognizing root path deep links without a trailing slash

Question

I'm experiencing an issue with deep linking in a Flutter app, particularly when using GoRouter for navigation. My web app is built with Next.js, hosted on Vercel, and uses a custom domain (www.example.com). I've set up deep linking following the official Flutter documentation, including adding assetlinks.json to the /public/.well-known directory and configuring AndroidManifest.xml as follows:

<meta-data android:name="flutter_deeplinking_enabled" android:value="true" />
<intent-filter android:autoVerify="true">
    <action android:name="android.intent.action.VIEW" />
    <category android:name="android.intent.category.DEFAULT" />
    <category android:name="android.intent.category.BROWSABLE" />
    <data android:scheme="http" android:host="www.example.com" />
    <data android:scheme="https" />
</intent-filter>

With this setup, deep links work as expected, opening the app from URLs shared in other apps. However, the issue arises when integrating GoRouter for in-app navigation with the following basic setup:

import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';

void main() => runApp(MaterialApp.router(routerConfig: router));

final router = GoRouter(
  routes: [
    GoRoute(
      path: '/',
      builder: (_, __) => Scaffold(appBar: AppBar(title: const Text('Home Screen'))),
      routes: [
        GoRoute(
          path: 'details',
          builder: (_, __) => Scaffold(appBar: AppBar(title: const Text('Details Screen'))),
        ),
      ],
    ),
  ],
);

Navigating to www.example.com/details works flawlessly, but attempting to open www.example.com to reach the HomeScreen ('/' path) triggers a GoException:

GoException: no routes for location: https://www.example.com

Upon investigation, I found that GoRouter receives an empty string instead of '/' for the root path. Here's the state at the time of the exception (logged within onException of GoRouter):

state.error: null
state.path: null
state.fullPath:
state.uri: https://www.example.com
state.topRoute: null
state.extra: null
state.matchedLocation:
state.pageKey: [<'topLevel'>]
state.pathParameters: {}
state.name: null

Interestingly, navigating to www.example.com// (with a double slash) correctly opens the root route ('/'). Neither www.example.com nor www.example.com/ (with a single slash) works as expected. It seems GoRouter anticipates a trailing slash in the domain, but my URL doesn't include one, resulting in routing issues.

Question: What could be causing this discrepancy? I am not sure where should I look for the potential cause - because I am not sure if this is an issue with Vercel, Next.js, or GoRouter. Any insights or solutions to ensure the root URL correctly routes to '/' in GoRouter would be greatly appreciated.

Answer 1

Can you try to add:

initialLocation: '/',

to your GoRouter and see if that helps?

Edit:

You could also try to use the redirect function like:

redirect: (BuildContext context, GoRouterState state) {
  // if the path is null or empty, go to '/'
  if(state.fullPath?.isEmpty ?? true) return '/';
  // otherwise try to go wherever we were trying to go before
  return null;
}