Can't land directly on subpage url on flutter web - flutter

This is my web site: https://patrickferreira.com.br
It has these routes:
/calculadoracelular
/calculadorapc
/robotrader
I will use the route /robotrader as an example but this happens with any route.
When I run the webapp on localhost I can access a subpage by typing on the browser: localhost:70721/robotrader which is what I expect. But when the site hosted on the web, it shows an error when I try to access the subpage in patrickferreira.com.br/robotrader.
Something weird is that if you access the home page in patrickferreira.com.br, and then access the subpages through there, the browser shows the correct url as patrickferreira.com.br/robotrader
Route<dynamic> generateRoute(RouteSettings settings) {
switch (settings.name) {
case '/calculadoracelular':
return MaterialPageRoute(builder: (_) => ProductPage(work: tradeSizeCalculatorForMobile));
case '/calculadorapc':
return MaterialPageRoute(builder: (_) => ProductPage(work: tradeSizeCalculatorForDesktop));
case '/robotrader':
return MaterialPageRoute(builder: (_) => ProductPage(work: tradingBot));
default:
return MaterialPageRoute(builder: (_) => const MyHomePage(title: 'Portfólio Patrick Ferreira'));
}
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Portfólio Patrick Ferreira',
debugShowCheckedModeBanner: false,
theme: ThemeData(
fontFamily: "Ubuntu",
primarySwatch: Colors.deepOrange,
),
onGenerateRoute: (settings) => generateRoute(settings),
initialRoute: '/#',
routes: {
'/': (context) => const MyHomePage(title: 'Portfólio Patrick Ferreira'),
'/calculadorapc': (context) => ProductPage(work: tradeSizeCalculatorForDesktop),
'/calculadoracelular': (context) => ProductPage(work: tradeSizeCalculatorForMobile),
'/robotrader': (context) => ProductPage(work: tradingBot),
},
);
}
}

Related

flutter navigator links / routes doesn't work from external

I'm building a webapp with flutter and Navigator 2.0.
The in app navigation work fine. But as soon as I publish my app on a webserver and try to got to a url that points to a rout in my app the routes aren't loaded and the app starts at the homepage.
For example:
Link I click from outside: https://flutter-project.com/#/contacts/ID6Nx2wTxgFcNW3gvMb2
Location the app opens in the browser: https://flutter-project.com/#/
Is there a way to make this possible so that users can share links to other people and they can open them?
Currenty the only way to open links is to open the webapp and then paste the link in the browserwindow where the app already was started but that is not the behaviour I expect from a webapp. I want to click the link and be right where it points at.
I also have this problem.
This is my web site: patrickferreira.com.br
It has these routes:
/calculadoracelular
/calculadorapc
/robotrader
if you try patrickferreira.com.br and click in one of the items in the fourth section it navigates to the routes as expected
But if you try to land directly on a subpage it throws a broken link error.
Route<dynamic> generateRoute(RouteSettings settings) {
switch (settings.name) {
case '/calculadoracelular':
return MaterialPageRoute(builder: (_) => ProductPage(work: tradeSizeCalculatorForMobile));
case '/calculadorapc':
return MaterialPageRoute(builder: (_) => ProductPage(work: tradeSizeCalculatorForDesktop));
case '/robotrader':
return MaterialPageRoute(builder: (_) => ProductPage(work: tradingBot));
default:
return MaterialPageRoute(builder: (_) => const MyHomePage(title: 'Portfólio Patrick Ferreira'));
}
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Portfólio Patrick Ferreira',
debugShowCheckedModeBanner: false,
theme: ThemeData(
fontFamily: "Ubuntu",
primarySwatch: Colors.deepOrange,
),
onGenerateRoute: (settings) => generateRoute(settings),
initialRoute: '/#',
routes: {
'/': (context) => const MyHomePage(title: 'Portfólio Patrick Ferreira'),
'/calculadorapc': (context) => ProductPage(work: tradeSizeCalculatorForDesktop),
'/calculadoracelular': (context) => ProductPage(work: tradeSizeCalculatorForMobile),
'/robotrader': (context) => ProductPage(work: tradingBot),
},
);
}
}

How do I manage navigation routes table with Flutter connected to Firebase Firestore

I wonder how to manage screen navigation when your app is connected to Firebase.
When my app was offline I used a routes table, but Im not sure how to do now. Could I do as I show with my code below; use a streambuilder that switches between the AuthScreen when logged out and HomeScreen when logged in, and a routes table to switch with the following screens also when signed in.
I tried this approach but when im signing out from another screen than the HomeScreen the user stays signed in.
How can I set up my routes so that the user always signs out independent from which screen the user's currently on.
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'FlutterApp',
theme: ThemeData(
primarySwatch: Colors.orange,
),
home: StreamBuilder(
stream: FirebaseAuth.instance.authStateChanges(),
builder: (
ctx,
userSnapshot,
) {
if (userSnapshot.hasData) {
return HomeScreen();
}
return AuthScreen();
}),
routes: {
Screen1.routeName: (ctx) => Screen1(),
Screen2.routeName: (ctx) => Screen2(),
Screen3.routeName: (ctx) => Screen3(),
Screen4.routeName: (ctx) => Screen4(),
});
}
}
I don't think you're going about this the right way.
They are various ways of doing this. Here's mine.
Firstly, I think you should define an initial route that checks if the user is signed in.
Widget build(BuildContext context) {
return MaterialApp(
title: 'FlutterApp',
theme: ThemeData(
primarySwatch: Colors.orange,
),
initialRoute:
FirebaseAuth.instance.currentUser == null ? "/login" : "/home",
routes: {
"/home": (ctx) => HomeScreen(),
"/login": (ctx) => AuthScreen(),
Screen1.routeName: (ctx) => Screen1(),
Screen2.routeName: (ctx) => Screen2(),
Screen3.routeName: (ctx) => Screen3(),
Screen4.routeName: (ctx) => Screen4(),
});
}
Note: "/home" & "/login" could be whatever you want as long as it's a string.
For logout, you need to replace the current screen with the login page, something like this should do.
Navigator.pushNamedAndRemoveUntil(context, '/login', (route) => false);

flutter: Navigation routes not working on authentication

I am new to flutter and trying to get this to work. I have a Welcome() page, which has two buttons (SignUp and SignIn), which take you to SignUp() and SignIn() pages. After successfully authenticating, the app should navigate to Home(), but it does not. Neither does it go back to Welcome() page if user logs out. Also, if the app is started and user was already logged in, it doesn't automatically go to Home(), it stays at Welcome(). What am I doing wrong here?
I am using a StreamProvider like so
if (snapshot.connectionState == ConnectionState.done) {
return StreamProvider<User>.value(
value: AuthService().user, child: Wrapper());
}
And my wrapper looks like this:
class Wrapper extends StatelessWidget {
const Wrapper({Key key}) : super(key: key);
#override
Widget build(BuildContext context) {
final user = Provider.of<User>(context);
if (user != null)
print(user.id);
else
print("User is null");
return MaterialApp(initialRoute: '/', routes: {
'/': (context) => user == null ? Welcome() : Home(),
'/signup': (context) => SignUp(),
'/signin': (context) => SignIn()
'/profile': (context) => Profile(),
'/edit': (context) => Edit()
});
}
This prints the user ID, which means the user is not null, but it does not navigate to Home().
I'm not dictating you what to do but i will just show you how i usually do.
The concept is simple. When the user successfull login or signup, you must save this information in a shared_preference. It may be like auth : true.
You must also wait on the app launching process to see if the user already login or not and based on that, you can navigate to another screen.
To check at startup if user is authenticated, you must read the auth property you previously added in shared_preference. Look at this code :
void main() async {
var mapp;
var routes = <String, WidgetBuilder>{
'/initialize': (BuildContext context) => Initialize(),
'/register': (BuildContext context) => Register(),
'/home': (BuildContext context) => Home(),
};
print("Initializing.");
WidgetsFlutterBinding.ensureInitialized();
await SharedPreferencesClass.restore("initialized").then((value) {
if (value) {
mapp = MaterialApp(
debugShowCheckedModeBanner: false,
title: 'AppName',
theme: ThemeData(
primarySwatch: Colors.blue,
),
routes: routes,
home: Home(),
);
} else {
mapp = MaterialApp(
debugShowCheckedModeBanner: false,
title: 'AppName',
theme: ThemeData(
primarySwatch: Colors.blue,
),
routes: routes,
home: Initialize(),
);
}
});
print("Done.");
runApp(mapp);
}
This code is so self explanatory. You can adapt it to your edge.
To navigate to a new screen it is simple, just use this code :
Navigator.push(
context,
MaterialPageRoute(builder: (context) => SecondRoute()),
);

Can't create new Flutter Provider

Hi I am trying to add a new Provider on the root level of my App. However, the create function of the new Provider (In this case more easily represented by the Provider of type int) doens't get called as I can see in my Console.
class MyApp extends StatelessWidget {
final List<SingleChildWidget> providers = [
Provider<DynamicLinkService>(
create: (context) {
print("Dynamic Link Service Provider gets built");
return DynamicLinkService();
},
),
Provider<int>(create: (context) {
print("Int Provider gets built");
return 1;
}),
];
#override
Widget build(BuildContext context) {
return MultiProvider(
providers: providers,
builder: (ctx, _) {
return MaterialApp(
theme: themeData(context),
debugShowCheckedModeBanner: false,
title: 'Flutter Demo',
onGenerateRoute: (settings) {
return getPageRoute(settings);
},
home: StartUpView(),
navigatorKey: locator<NavigationService>().navigatorKey,
);
},
);
}
}
Console Output:
Dynamic Link Service Provider gets built

Flutter Navigator not pushing onto the stack

I'm experiencing a really strange problem with Flutter's navigation.
I'm using named routes. For this reason I'm supplying my Navigator with an onGenerateRoute method:
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Flutter Demo',
onGenerateRoute: Routes.onGenerateRoute,
initialRoute: Routes.ROOT,
);
here's my onGenerateRoute:
static Route onGenerateRoute(RouteSettings settings) {
switch (settings.name) {
case ROOT:
return MaterialPageRoute(
builder: (BuildContext context) {
return MyRootPage();
},
);
case PAGE_1:
return MaterialPageRoute(
builder: (context) {
return MyPage1();
},
fullscreenDialog: true,
);
case PAGE_2:
return MaterialPageRoute(
builder: (context) {
return MyPage2();
}
);
default:
break;
}
return null;
}
Now, suppose I start my application landing on the ROOT route, and then I navigate to ´PAGE_1´ by using
Navigator.of(context).pushNamed(Routes.PAGE_1)
Then I navigate to MyPage2 by using:
`Navigator.of(context).pushNamed(Routes.PAGE_2)`.
Here's the problem.
I'm expecting MyPage2 to be pushed onto MyPage1, resulting in this widget tree:
MaterialApp
|__MyRootPage()
|__MyPage1()
|__MyPage2()
but instead, I get this:
MaterialApp
|__MyPage2()
|__MyRootPage()
|__MyPage1()
What am I missing?
Thanks in advance!