将URL参数传递到飘动的单页应用程序

发布于 2025-02-14 01:00:54 字数 1047 浏览 1 评论 0原文

我写了一个颤音的水疗中心。该应用的URL看起来像这样：

https://acmecorp.web.app.app/#/

并且访问的任何页面都不显示更新的URL（因为我不希望人们在应用中共享单个页面）。

但是，当用户被定向到网站时，我想捕获一个可选参数（用户ID），类似的内容：

https://acmecorp.web.app/#/uid 或

？一旦通过开始页面捕获UID并将其设置为局部变量，我就不需要在URL栏中生存。

我尝试使用html.window.location.href和对此的变体尝试捕获UID，这是不成功的。我了解磅标志向URL片段发出信号，因此剥离后的东西，但是即使使用参数的位置也没有帮助，例如https://acmecorp.web.web.app.uid=test/#/ < /code>或https://acmecorp.web.app/?uid=test#/。

我还尝试在main.dart中与Gorouter弄乱，

    routes: <GoRoute>[
      GoRoute(
        path: '/',
              builder: (context, state) => StartPageWidget(
                uid: state.queryParams['did'],
              ),
      ),
    ],
  );

因为我的成功率有限，因为当我尝试导航到其他页面时，它似乎会破坏路由。

这似乎是超级简单的事情，我不确定我缺少什么。我是一名数据科学家，非常新鲜！

感谢您的帮助！

原文

I have written a flutter SPA. The URL for the app looks like this:

https://acmecorp.web.app/#/

and any pages visited do not show an updated URL (because I don't want people to share individual pages within the app).

However, I would like to capture an optional parameter (user id) when users are directed to the site, something like this:

https://acmecorp.web.app/#/uid or https://acmecorp.web.app/#/?uid=test

. Once the uid is captured by the start page and set as a local variable, I don't need this uid to survive in the URL bar.

I have tried using html.window.location.href and variations of this to try to capture the uid, which was unsuccessful. I understand that the pound sign signals a URL fragment so things after it are stripped, but even playing with the position of the parameters has not helped e.g. https://acmecorp.web.app?uid=test/#/ or https://acmecorp.web.app/?uid=test#/.

I also tried messing around with gorouter in main.dart

    routes: <GoRoute>[
      GoRoute(
        path: '/',
              builder: (context, state) => StartPageWidget(
                uid: state.queryParams['did'],
              ),
      ),
    ],
  );

with limited success, as I then have the problem that it seems to ruin the routing when I try to navigate to the other pages.

This seems like something super simple and I'm not sure what I'm missing. I'm a data scientist so pretty new to this!... I do recall being able to do this in angular quite easily.

Thanks for any help!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

柠檬心 2025-02-21 01:00:54

使用 uri.base 以捕获类似此类似的查询参数

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomePage(uid: Uri.base.queryParameters['uid']),
    );
  }
}

class HomePage extends StatelessWidget {
  const HomePage({Key? key, required this.uid}) : super(key: key);

  final String? uid;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(child: Text(uid ?? 'No uid')),
    );
  }
}

Use Uri.base to capture query parameters like this:

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomePage(uid: Uri.base.queryParameters['uid']),
    );
  }
}

class HomePage extends StatelessWidget {
  const HomePage({Key? key, required this.uid}) : super(key: key);

  final String? uid;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(child: Text(uid ?? 'No uid')),
    );
  }
}

回复收藏 0 原文

~没有更多了~