Flutter-一个Android,iOS和网络路由问题的代码库



我对Flutter比较陌生,到目前为止对它印象深刻。使用相同的代码库(当然,每个"口味"都有特定的配置(,我能够为所有三种口味构建一个应用程序版本。然而,即使我已经阅读了多个文档,我仍然不确定如何达到我所需要的内部导航级别。

以下是所需流程:

  • 用户扫描二维码并重定向到HTTPs端点(Flutter生成的代码,理想情况下,这将在main.dart中完成,所有代码都相同-Android、iOS和web(;QR码包含的URL包括一个参数,用于确定要打开的应用程序视图/路由以及要加载的数据
  • 如果安装了本机应用程序(与web应用程序相同的代码库(,将启动应用程序并向其传递param,以便使用正确的路由,加载带有param设置为的ID的对象,否则,用户将被重定向到web应用程序中的所述视图/路由(在浏览器上下文中运行(

因此,为了便于说明,如果URL为:https://example.com/objects?id=73或https://example.com/objects/73(对我来说,这不是一个"漂亮"的URL(

然后,如果应用程序可用,它将被启动(或重新加载(,相关路线将被导航到,加载与id参数(对象ID 73(相对应的对象,否则,用户将被重定向到web浏览器中的正确路线。

为了检测是否安装了应用程序并在安装后启动它,我找到了flutter_appavailability包,但它似乎没有得到维护,在web环境中也不起作用。我找到了其他选择(这看起来有点前景https://pub.dev/packages/uni_links)但我似乎无法确定什么是最佳选择(毕竟这是一种相当常见的情况,我相信有一种解决方案被认为是标准的(。我希望从别人的经验中学习。

下一个问题是如何实现内部导航。我的应用程序将对象存储在Firebase DB中,默认屏幕加载集合,如下所示:

Stream<QuerySnapshot> loadAllObjects() {
return Firestore.instance
.collection('objects').where('active',isEqualTo: true)
.limit(50)
.snapshots();
}

然后,代码对结果集进行迭代,并为每个对象生成相应的小部件。小部件代码包括一个onPressed回调,这样,当按下其中一个回调时,用户将被导航到一条新的路线,显示所需对象的数据。

以上内容在Android、iOS和web中都能正常工作,但我不确定的是如何让应用程序读取二维码中包含的HTTP get参数,并使用正确的数据导航到所需的路线。如果可能的话,我想在没有条件的情况下实现这一点,比如:

if (Platform.isAndroid) {
..
else if (Platform.isIOS) {
..
or
kIsWeb ? "Web" : "Mobile"

更新:我发现了这个https://pub.dev/packages/flutter_modular,这似乎能够满足我的路由需求。有人对这个软件包在可用性、稳定性、文档等方面有反馈吗?在我看来很有希望

提前感谢任何输入和实施指南,

对于您的第一个问题,有一个很棒的url启动包,它的工作原理就像一个魅力:url_launcher

默认情况下,Android在处理URL时会打开浏览器。你可以传递forceWebView:true参数,告诉插件打开WebView相反如果您对包含JavaScript的页面的URL执行此操作,确保传入enableJavaScript:true,否则传入启动方法将无法正常工作。在iOS上,默认行为是打开所有应用程序中的web URL。其他所有内容都重定向到应用程序处理程序。

如果手机上安装了应用程序,您也可以直接打开应用程序(例如Instagram、Twitter或Facebook页面(,使用url_launcher,如果没有安装特定的应用程序,也可以很容易地重定向到WebView。

如果你想使用链接打开你自己的应用程序,你也可以使用url_launcher和深度链接(或URI处理程序(,查看这篇媒体文章,了解如何使用Flutter设置它们的精确说明。

Deep Links和Flutter应用。如何正确处理它们。

最新更新