CODEWITHSUNDEEP
flutterpaymentdeeplink
Mohsen Emami
Mohsen Emami

Reputation: 3142

How to automatically return back to Flutter app after user completes a web form

I am developing a toll-payment mobile application with Flutter and I need to provide an internet payment (with bank's IPG page) for user to pay her/his toll debt.
What exactly I need is to automatically return back to my Flutter app after user finishes the form and taps on submit button.
How to do that?

Upvotes: 4

Views: 2528

Answers (2)

Saleh Galiwala
Saleh Galiwala

Reputation: 11

This is the code I used in my app for flutterwave payment gateway

Expanded(
          child: Stack(
            children: [
              WebView(
                javascriptMode: JavascriptMode.unrestricted,
                initialUrl: selectedUrl,
                gestureNavigationEnabled: true,
                userAgent: 'Mozilla/5.0 (iPhone; CPU iPhone OS 9_3 like Mac OS X) AppleWebKit/601.1.46 (KHTML, like Gecko) Version/9.0 Mobile/13E233 Safari/601.1',
                onWebViewCreated: (WebViewController webViewController) {
                  _controller.future.then((value) => controllerGlobal = value);
                  _controller.complete(webViewController);
                },
                onPageStarted: (String url) {
                  if(url.contains(AppConstants.BASE_URL)) {
                    bool _isSuccess = url.contains('success');
                    bool _isFailed = url.contains('fail');
                    print('Page started loading: $url');
                    setState(() {
                      _isLoading = true;
                    });
                    if (_isSuccess) {
                      Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(builder: (_) => DashBoardScreen()), (route) => false);
                      showAnimatedDialog(context, MyDialog(
                        icon: Icons.done,
                        title: getTranslated('payment_done', context),
                        description: getTranslated('your_payment_successfully_done', context),
                      ), dismissible: false, isFlip: true);
                    } else if (_isFailed) {
                      Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(builder: (_) => DashBoardScreen()), (route) => false);
                      showAnimatedDialog(context, MyDialog(
                        icon: Icons.clear,
                        title: getTranslated('payment_failed', context),
                        description: getTranslated('your_payment_failed', context),
                        isFailed: true,
                      ), dismissible: false, isFlip: true);
                    } else if (url == '${AppConstants.BASE_URL}/cancel') {
                      Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(builder: (_) => DashBoardScreen()), (route) => false);
                      showAnimatedDialog(context, MyDialog(
                        icon: Icons.clear,
                        title: getTranslated('payment_cancelled', context),
                        description: getTranslated('your_payment_cancelled', context),
                        isFailed: true,
                      ), dismissible: false, isFlip: true);
                    }
                  }
                },
                onPageFinished: (String url) {
                  print('Page finished loading: $url');
                  setState(() {
                    _isLoading = false;
                  });
                },
              ),

Upvotes: 1

Sohail
Sohail

Reputation: 413

This may be too late, but you can use Uni Links package to define a URI scheme like: my_great_app://open to be called by your web form to return to the app. That package works for both Android and iOS, and you can define both Deep link or App link, based on your criteria. Most apps use the simpler Deep links for that purpose.

There are also other packages in pub.dev to do that, search "App Link" or "Universal Link" to find more.

Upvotes: 3

Related Questions