2

I have a website being hosted using flutter, for example https://appname.com/. When the user goes to appname.com, I open a specific route called "home". However if the user types in https://appname.com/username then it needs to open a specific Flutter route "profile" and pass on that data "username" from the URL to it. Is this possible using Flutter Web? Is there a way to detect usernames via Flutter Web from the URL?

Right now I have many routes within the Flutter Web App but I need to be able to open a specific route called "profile" whenever a username is entered in the URL. I'll give some code examples of what I currently have:

routes.dart file

const String WelcomeRoute = "/welcome";
const String SigninRoute = "/signin";
const String HomeRoute = "/home";
const String ProfileRoute = "/profile"; // I do NOT want the URL to change to https://appname.com/profile when this route is opened

main.dart file

  PageRouteBuilder _routeToPage(Widget page, RouteSettings settings) {
    return PageRouteBuilder(
      settings: settings,
      pageBuilder: (_, __, ___) => page,
      transitionsBuilder: (_, a, __, c) => FadeTransition(opacity: a, child: c),
    );
  }

..... Then inside the MaterialApp code, I have .....

    onGenerateRoute: (settings) {
    Uri settingsURI = Uri.parse(settings.name!);
    String path = settingsURI.path.toString();
    if (path == WelcomeRoute) {
      return _routeToPage(const WelcomePage(), settings);
    }
    if (path == SigninRoute) {
      return _routeToPage(const SigninPage(), settings);
    }
    if (path == HomeRoute) {
      return _routeToPage(const HomePage(), settings);
    }
    if (!pathsList.contains(path)) { // I need to route to ProfileRoute with some condition but not change the URL from https://appname.com/username to https://appname.com/profile
      return _routeToPage(const ProfilePage(), settings);
    }

Is there a way to detect whether the path provided in the URL is a known route or not (let's say if not part of any routes), then go to Profile Page but keep the same URL?

If it makes any difference, the app is being hosted using Firebase Hosting.

BunkBedNoob
  • 367
  • 1
  • 4
  • 15
  • you can get url from Uri.base. after you login save your username to variable if (path == Profile && var_username==username) { return _routeToPage(const ProfilePage(), settings); } – anggadaz Jun 13 '22 at 02:17
  • 1
    Check this https://stackoverflow.com/questions/57552885/how-can-a-named-route-have-url-parameters-in-flutter-web#answer-72105506 – swaroop suthar Jun 13 '22 at 07:38

1 Answers1

3

Simple

You need route package like go_router

Show doc this section

Taz
  • 1,737
  • 1
  • 15
  • 30
  • Yes using go_router would most likely be best for this. You'll end up using a router where you can set up different routes, like you have now, and specify that the profile accepts `/:username` or something similar. – Amxela Jun 17 '22 at 15:56