如何在flutter webview中打开应用程序链接？答案

【问题标题】：How to open app links in flutter webview?如何在flutter webview中打开应用程序链接？
【发布时间】：2019-01-20 20:36:54
【问题描述】：

在 Flutter 中，我使用 flutter webview plugin 来启动如下网址：

flutterWebviewPlugin.launch(url)

或

WebviewScaffold(
  url: url,
  appBar: new AppBar(title: Text(title), actions: [
    new IconButton(
      icon: const Icon(Icons.share),
      onPressed: () => Share.share(url),
    )
  ]),
  withZoom: true,
  withLocalStorage: true,
  withJavascript: true,
);

但是，如果打开的网页中的任何链接是应用链接，例如：fb://profile，我会得到 net::ERR_UNKNOWN_URL_SCHEME。

在android中，我发现解决方案是覆盖here中提到的shouldOverrideUrlLoading，但是在flutter中我应该怎么做？

【问题讨论】：

你能把你的代码放上来吗？

标签： flutter

【解决方案1】：

看起来你可以使用这个插件实现你所需要的：https://pub.dartlang.org/packages/flutter_web_view

收听您的重定向：

  flutterWebView.listenForRedirect("fb://profile", true);

使用以下方法获取值：

flutterWebView.onRedirect.listen((url) {
   flutterWebView.dismiss();
    //now you have the url
 });

得到url后就可以使用这个包https://pub.dartlang.org/packages/url_launcher

【讨论】：

那个插件有很多问题，例如gradle 文件缺少对 kotlin 的依赖项，AndroidManifest 文件缺少活动声明等。我已通过电子邮件向开发人员发送电子邮件，看看他是否仍在维护它。

【解决方案2】：

你可以像这样使用网络插件

 @override
 Widget build(BuildContext context) {
   String url = widget.url;
   return Scaffold(
    body: Center(
    child : WebviewScaffold(
      url: "https://google.com",
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      withZoom: true,
      withLocalStorage: true,
     )
   ),
 );
}

【讨论】：

【解决方案3】：

您可以在 pub.dev 包中使用 webview_flutter

WebView(
        initialUrl: 'https://my.url.com',
        javascriptMode: JavascriptMode.unrestricted,
        navigationDelegate: (NavigationRequest request)
        {
          if (request.url.startsWith('https://my.redirect.url.com'))
          {
            print('blocking navigation to $request}');
            _launchURL('https://my.redirect.url.com');
            return NavigationDecision.prevent;
          }

          print('allowing navigation to $request');
          return NavigationDecision.navigate;
        },
      )

您可以在 pub.dev Packages 中使用 url_launcher 启动 url

_launchURL(String url) async {
if (await canLaunch(url)) {
  await launch(url);
} else {
  throw 'Could not launch $url';
}}

【讨论】：

我正在使用相同的代码来允许在 Flutter webview (pub.dev/packages/webview_flutter) 中使用 mailto 方案。但它抛出错误，我无法构建 apk 文件。
错误：不是常量表达式。 if (request.url.contains("mailto:")) { ^^^^^^^ 错误：方法调用不是常量表达式。 if (request.url.contains("mailto:")) { ^^^^^^^^ 错误：方法调用不是常量表达式。启动（request.url）； ^^^^^^ 错误：不是常量表达式。 navigationDelegate: (NavigationRequest 请求) { ^^^^^^^^^^^^^^^^^^^^^^^^^^
我也把它贴在了栈上。 - 请检查这个 - stackoverflow.com/questions/65880593/…

【解决方案4】：

我在下面复制了net::ERR_UNKNOWN_URL_SCHEME 错误here 的解决方案：

在您的application 标签中添加以下行：

android:usesCleartextTraffic="true"

如下图：

<application
    ....
    android:usesCleartextTraffic="true"
    ....>

如果您有网络安全配置，例如：android:networkSecurityConfig="@xml/network_security_config"

不需要如上图那样将明文流量设置为true，而是使用下面的代码：

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        ....
        ....
    </domain-config>

    <base-config cleartextTrafficPermitted="false"/>
</network-security-config>

将cleartextTrafficPermitted 设置为true

【讨论】：