Flutter Question posted in
The official Flutter documentation can be found here.

Is it possible to pass parameters to flutter app embedded into html?

I need to pass parameters to flutter app hosted inside html page, as explained here:

https://docs.flutter.dev/deployment/web#embedding-a-flutter-app-into-an-html-page

Important: for performance and architectural reasons it is not iFrame, it is direct embedding.

Is there a way to do it, either with route parameters or command line arguments or somehow differently?

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    To enable passing parameters through direct embedding, the Flutter app should be made multi-view. Example: https://github.com/ditman/flutter-experimental/blob/main/multi_counter/web/flutter_bootstrap.js#L36


  2. 0

    Yes, it is possible to pass parameters to a Flutter app embedded into an HTML page. You can achieve this by using the window.defaultRouteName property and the PlatformDispatcher.instance.defaultRouteName in Flutter. Here is a summary of how to do it:

    1. Embedding Parameters in HTML: Pass parameters via the URL query string to the HTML page hosting the Flutter app. For example:
    <iframe src="your_flutter_app.html?param1=value1&param2=value2"></iframe>
    1. Extracting Parameters in Flutter: In your Flutter app, you can use the defaultRouteName to capture the parameters.
    import 'dart:ui' as ui;

void main() {
  final String? defaultRouteName = ui.window.defaultRouteName;
  runApp(MyApp(defaultRouteName: defaultRouteName));
}

class MyApp extends StatelessWidget {
  final String? defaultRouteName;

  MyApp({this.defaultRouteName});

  @override
  Widget build(BuildContext context) {
    // Parse the defaultRouteName to get the parameters
    // For example, if defaultRouteName is "/?param1=value1&param2=value2",
    // you can extract param1 and param2 from it
    return MaterialApp(
      // Your app code here
    );
  }
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search