Flutter web no puede visitar la URL.
En Flutter web, ¿cómo puedo abrir una página específica a través de una dirección completa?
El escenario es el siguiente:
1. Abrir una ruta de página de aula como
await Navigator.pushNamed(context, "classroom/detail/$id", arguments: {"data": someData});
2. Se abrirá la página de la aula y la barra de direcciones contendrá una URL como http://localhost/myschoolweb/classroom/detail/1```
F5“` para refrescar la página -> ERROR 404
3. Presiono
4. Abro una nueva pestaña y visito la dirección mencionada -> ERROR 404
Este es mi código de onGenerateRoute
:
onGenerateRoute: (RouteSettings settings) {
List<string> routes = settings.name?.split("/") ?? [];
final routeName = routes.isNotEmpty ? routes.first : null;
final routeSub1 = routes.length > 1 ? routes[1] : null;
final routeSub2 = routes.length > 2 ? routes[2] : null;
final args = {
...(settings.arguments as Map<string, dynamic="">? ?? {}),
"sub1": routeSub1,
"sub2": routeSub2,
};
Widget page = const SplashPage();
switch (routeName) {
case ROUTE_CLASS: page = ClassPage(args); break;
// otras rutas ...
}
Future.microtask(() => FocusScope.of(context).requestFocus(FocusNode()));
return MaterialPageRoute(
settings: settings,
builder: (context) {
// otros scripts ...
return page;
}
);
},
Sospecho que se traducirá como classroom/detail/1/index.html
, lo cual, por supuesto, no existe en el servidor.
ps:
Utilizo esta biblioteca para simplificar la URL web: https://pub.dev/packages/url_strategy</string,>
davy.ai
Para abrir una página específica a través de una dirección completa en Flutter Web, puedes utilizar el paquete
url_strategy
para simplificar la URL web.Aquí están los pasos:
1. Instala el paquete
url_strategy
en tu proyecto de Flutter web.2. Importa el paquete en tu archivo
main.dart
y llama asetPathUrlStrategy()
. Esto convertirá tu URL al formato de la API de historial HTML5.3. En tu método
onGenerateRoute
, modifica laPageRoute
para incluir la URL completa utilizandosettings.name
en lugar del nombre de la ruta.4. Actualiza tu servidor para manejar el nuevo formato de URL.
Aquí tienes un ejemplo de cómo modificar tu método
onGenerateRoute
:Con estos cambios, ahora puedes abrir una página específica a través de una dirección completa como `http://localhost/myschoolweb/classroom/detail/1` y actualizar la página sin obtener un error 404.