Estaba tratando de agregar una puerta de enlace de pago usando la biblioteca flutter de WebView. Al completar con éxito el pago, la puerta de enlace redirige a una URL de retorno o webhook con respuesta de transacción. Ahora, en lugar de redirigir a una URL externa, quiero redirigir a mi aplicación y quiero leer el estado de la transacción de la respuesta que se envía. Todo lo que quiero saber es si la transacción es exitosa o falla.
'''
WebView( navigationDelegate: (action) { return NavigationDecision.navigate; }, onPageStarted: (url) => _onPageStart(url), onPageFinished: (url) => _onPageFinish(url), gestureNavigationEnabled: true, debuggingEnabled: true, javascriptMode: JavascriptMode.unrestricted, initialUrl: url, onWebViewCreated: (WebViewController webcontroller) { _controller = webcontroller; }, ), void _onPageStart(url) { Future<String> future = _controller .runJavascriptReturningResult("window.document.body.outerHTML"); future.then((data) { print("ONpage start $data"); }); } Future<void> _onPageFinish(url) async { Future<String> future = _controller .runJavascriptReturningResult("window.document.body.outerHTML"); future.then((data) { print(data); }); }'''
Lo que tiene que hacer es simplemente agregar un canal javascript a su vista web como este:
WebView( onPageStarted: (url) => _onPageStart(url), onPageFinished: (url) => _onPageFinish(URL), gestureNavigationEnabled: true, debuggingEnabled: true, javascriptMode: JavascriptMode.unrestricted, initialUrl: URL, javascriptChannels: <JavascriptChannel>{ _toasterJavascriptChannel(context), }, ); /* create functionality on your web side also for this javascript channel use the name 'Toaster' on the web side also ( use same name on web side and app side , name can be anything 'toaster' is example shown here) */ JavascriptChannel _toasterJavascriptChannel(BuildContext context) { return JavascriptChannel( name: 'Toaster', onMessageReceived: (JavascriptMessage message) { // ignore: deprecated_member_use Scaffold.of(context).showSnackBar( SnackBar(content: Text(message.message)), ); }); }Cuando haga clic en cualquier función en el sitio web, llame a este Toaster javascriptChannel en el lado web y también escuchará en el lado de la aplicación.