CODEWITHSUNDEEP
flutterflutter-inappwebview
Huu Bao Nguyen
Huu Bao Nguyen

Reputation: 1181

How to open deep link in flutter_inappwebview when opening init url and then the user is clicking icon app for opening deep link?

I'm using flutter_inappwebview version 5.4.4+3 and having a problem with deep link on WebView.

InAppWebView(
   initialUrlRequest: URLRequest(url: Uri.parse('https://www.google.com/contact/')),
)

When The InitUrl was opened in InApp WebView of the application, This page has an icon app (example: youtube, linkedIn, etc...) for the user's clicking and navigating to the respective app.

page_init

After the user clicks, My application can't load this page or navigate to the respective app.

Example Deep link: myapp://openapp?type=...

unload_page

How to fix this problem?

Upvotes: 4

Views: 3504

Answers (3)

Scorpion
Scorpion

Reputation: 47

Sometimes (mostly now) deeplinks are normal https or https, you just need to check if url launcher can launch, if not, just launch in your inappwebview.

Upvotes: 0

Eugene Kuzmenko
Eugene Kuzmenko

Reputation: 1497

I faced up the same problem.

I suppose your app already handles deeplinks and we can skip this step.

In this case, you have to add shouldOverrideUrlLoading to your InAppWebView and open your link with the url_launcher plugin.


InAppWebView(
    shouldOverrideUrlLoading: (controller, navigationAction) async {
    
    final url = await controller.getUrl();
    final deeplink = navigationAction.request.url;

    if (deeplink != null && url != navigationAction.request.url) {
         launchUrl(deeplink, mode: LaunchMode.externalNonBrowserApplication);

         return NavigationActionPolicy.CANCEL;
    }

   return NavigationActionPolicy.ALLOW;
   },
   initialSettings: InAppWebViewSettings(
     useShouldOverrideUrlLoading: true,
 ),
)
....

Alternatively, handle deep links within shouldOverrideUrlLoading. Check for your deep link host, parse the path, and navigate using your preferred router (AutoRoute, GoRouter, etc.).

Upvotes: 1

Reza Aslejeddian
Reza Aslejeddian

Reputation: 371

I had this problem, After googling for a while I found nothing.

The solution that Eugene Kuzmenko was provided is a good solution but when the user goes to another website and the URL is different It's going to be launched in an external browser, To solve this my code lauches the deep link If It doesn't have https or http.

Hope It helps:

  Future<NavigationActionPolicy?> checkDeepLink(
      InAppWebViewController inAppWebViewController,
      NavigationAction navigationAction) async {
    final url = await state.webviewController?.getUrl();
    final deepLink = navigationAction.request.url;

    if (deepLink != null &&
        url != navigationAction.request.url &&
        (deepLink.scheme != 'https' && deepLink.scheme != 'http')) {
      launchUrl(deepLink, mode: LaunchMode.externalNonBrowserApplication);
      return NavigationActionPolicy.CANCEL;
    }

    return NavigationActionPolicy.ALLOW;
  }

Upvotes: 1

Related Questions