Popup is not working in Flutter Web VIew package - flutter

I am using 'flutter_webview' package for payment the web view working fine. but on payment its open new popup, that popup is working in other external browser but not in mobile view.
please guide me to handle the popup in webview.
Expanded(
child: WebView(
debuggingEnabled: true,
initialUrl: paymentUrl,
allowsInlineMediaPlayback: true,
javascriptMode: JavascriptMode.unrestricted,
gestureNavigationEnabled: true,
onWebViewCreated: (WebViewController webViewController) {
_controller = webViewController;
},
onWebResourceError: (WebResourceError webviewerrr) {
print("Handle your Error Page here");
},
javascriptChannels: Set.from([
JavascriptChannel(
name: 'Alert',
onMessageReceived: (JavascriptMessage message) {
// alert message = Test alert Message
print(message.message);
// TODO popup
},
)
]),
),
),

I found the solution, while using the razor pay we have to integrate razorpay_flutter package instead of going with the webview_flutter

Related

Flutter Webview Post form data

I am trying to integrate PayGoal payment integration in flutter app. I have to send data in form of form data .
I have also tried using dio through which I am getting html file in response which on rendering web view is not live .
Below is my Code
WebView(
javascriptMode: JavascriptMode.unrestricted,
debuggingEnabled: false,
onWebResourceError: (error) {
debugPrint(error.domain);
print(error);
},
zoomEnabled: true,
backgroundColor: Colors.transparent,
gestureNavigationEnabled: true,
onWebViewCreated: (controller) {
controller.loadRequest(
WebViewRequest(
uri: Uri.parse("https://uat.paygoal.in/order/v1/payment"),
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
method: WebViewRequestMethod.post,
body: Uint8List.fromList(
utf8.encode(
jsonEncode(map),
),
),
),
);
},
),
You have to send body in byte code simply convert map to string and remove json encode then send the post request

How to add circular indicator to webview in flutter

i am new here. Please forgive me if I make a mistake. I'm trying to make a payment screen. But I can't solve a small problem. I couldn't understand the cause of the problem. when i click to 'start payment' button it's show me that screen about 2 second.And it's look bad. Bad View
But good news it's skip automatically normal payment screen. How can I show something else(Circular progress indicator, Lineer progres indicator etc.) on the screen instead of that String? My codes are below;
if (data['Status'] != "failure") {
Navigator.of(context).push(MaterialPageRoute(
builder: ((context) => CoreWebView(
htmlCode: data['paymentUrl'],
))));
}
It's my WebView
WebViewPlus(
initialUrl: "https://example.com",
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (controller) {
//widget.html==data['paymentUrl'];
var page = 'r"""${widget.htmlCode}"""';
controller.loadString(page);
},
zoomEnabled: false,
),
Make your widget a StatefulWidget.
Add a variable as bool isLoading = true;.
Change your code as:
Stack(
children: [
WebViewPlus(
onPageFinished: (url) {
setState(() {
isLoading = false;
});
},
initialUrl: "https://example.com",
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (controller) {
//widget.html==data['paymentUrl'];
var page = 'r"""${widget.htmlCode}"""';
controller.loadString(page);
},
zoomEnabled: false,
),
if(isLoading)
Center(child: CircularProgressIndicator()
)
],
),

Null check operator used on a null value Error in reload webview

Please I'm working on a flutter WebView project and I need to reload my page if I click a button but it gave me this Error : Null check operator used on a null value. Thank you in advance
this is my code :
WebView(
initialUrl: "https://wikoget.com",
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (WebViewController webViewController) {
_webViewController = webViewController;
_controller.complete(webViewController);
},
onPageFinished: (String url) {
_webViewController
.evaluateJavascript("javascript:(function() { " +
"var head = document.getElementsByClassName('main-header-bar-wrap')[0];" +
"head.parentNode.style.cssText = ' position: sticky;position: -webkit-sticky; top : 0 ';" +
"var footer = document.getElementsByTagName('footer')[0];" +
"footer.parentNode.removeChild(footer);" +
"})()")
.then((value) => debugPrint('Page finished loading Javascript'));
},
onWebResourceError: (error) => setState(() {
isError = true;
}),
),
if (isError)Center(
child :RaisedButton(
padding: const EdgeInsets.symmetric(vertical: 10,horizontal: 30),
onPressed: ()=> _webViewController.reload(),
color: Color(int.parse("0xff135888")),
shape:const RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(30)),
),
child:const Text("Réessayez",style: TextStyle(color:Colors.white),)
),
],
),
),
Although your code is incomplete, here's what you need to make your webview reload easily.
Create a webview controller and initialize it when the webview is created to the controller of the webview:
WebViewController? webViewController;
.
.
.
onWebViewCreated: (controller){
webViewController = controller;
}
reload when your button is pressed:
onPressed: () {
webViewController!.reload();
},
Click here to read more about making your webview work excellently

Flutter handle on click events in Webview

I am trying to build webview in my mobile application
In the webview when click on search all the records to particular time period are shown it works but when click on Export To Excel button it should download the excel sheet but nothing works in my application..
Below is the code what I have done
Thanks for help!![enter image description here][1]
PS: URL hidden for security reasons..
`
Stack(
children: [
Container(
padding: EdgeInsets.all(10.0),
child: progress < 1.0
? LinearProgressIndicator(
value: progress,
backgroundColor: Colors.amber,
)
: Container()),
WebView(
initialUrl:
"URL",
javascriptMode: JavascriptMode.unrestricted,
gestureNavigationEnabled: true,
onWebViewCreated: (WebViewController controller) {
_webViewController = controller;
},
onProgress: (int progress) {
setState(() {
this.progress = progress / 100;
});
},
onPageFinished: (finish) {
setState(
() {
isLoading = false;
},
);
},
),
],
),
Use navigationDelegate parameter in Webview constructor.
WebView(
initialUrl: 'https://google.com',
navigationDelegate: (action) {
if (action.url.contains('mail.google.com')) {
print('Trying to open Gmail');
Navigator.pop(context); // Close current window
return NavigationDecision.prevent; // Prevent opening url
} else if (action.url.contains('youtube.com')) {
print('Trying to open Youtube');
return NavigationDecision.navigate; // Allow opening url
} else {
return NavigationDecision.navigate; // Default decision
}
},
),
That's it. Enjoy coding!

open a local IP web page in flutter

I need to open a local IP web page in flutter like 192.168.4.1,
but it didn't open wit me ...
can you help me :
this is my code
final Completer<WebViewController> _controller = Completer<WebViewController>();
String src = 'http://192.168.4.1/';
Scaffold(
appBar: AppBar(
title: Text('Easy Web View'),
leading: IconButton(
icon: Icon(Icons.access_time),
onPressed: () {
setState(() {
print("Click!");
open = !open;
});
},
),
),
body: WebView(
initialUrl: src,
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (WebViewController webViewController) {
_controller.complete(webViewController);
},
gestureNavigationEnabled: true,
)
)
Find out the location of adb.exe(mine is USERNAME\AppData\Local\Android\Sdk\platform-tools\adb.exe), then run the following command,
adb.exe reverse tcp:3000 tcp:3000
I am using the physical phone, and it's working for me.