Payment through razorpay on flutter web produces error - flutter

Question

I had implemented the razorpay payment gateway in my flutter project of an ecom store.
The payment works fine on mobile platform, but on web it is creating an issue. On web the user is redirected to different file named webpayment for making payment.
On web, when the user pays for an item on list page, the first time the webpayment gets succeeded and the user is redirected to detail page and on detail page when back button is pressed the user gets redirected to list page where other items are listed.
But when user pays for another item on list page the details of previous item whose payment was made is sent to webpayment page not the item on which the user had clicked.
Hot reloading the web,solves the problem but, now if after making another payment ,if user try to purchase another item the details of previous item is sent to the web payment page.Means user need to reload the page in web for making payment to another product.
The mobile app is working fine.There is some state management issue,I think in webpayment page which forces the details of previous purchased item to persist.
Below is the webpayment code which redirects user from list page to web payment page:
class Webpayment extends StatefulWidget {
final String? name;
final Map? buyer;
final String? postId;
final String? userId;
final String? category;
final String? usercity;
final double? price;
Webpayment({
Key? key,
this.name,
this.buyer,
this.postId,
this.userId,
this.category,
this.usercity,
this.price,
}) : super(key: key);
#override
_WebpaymentState createState() => _WebpaymentState(this.name, this.buyer,
this.postId, this.userId, this.category, this.usercity, this.price);
}
class _WebpaymentState extends State<Webpayment>
with AutomaticKeepAliveClientMixin<Webpayment> {
final String? name;
final Map? buyer;
final String? postId;
final String? userId;
final String? category;
final String? usercity;
final double? price;
_WebpaymentState(this.name, this.buyer, this.postId, this.userId,
this.category, this.usercity, this.price);
#override
void initState() {
super.initState();
}
#override
Widget build(BuildContext context) {
super.build(context);
ui.platformViewRegistry.registerViewFactory("rzp-html", (int viewId) {
IFrameElement element = IFrameElement();
window.onMessage.forEach((element) {
print('Event Received in callback: ${element.data}');
if (element.data == 'MODAL_CLOSED') {
} else if (element.data == 'SUCCESS') {
print('PAYMENT SUCCESSFULL!!!!!!! ${widget.postId}');
var userid = auth.currentUser!.uid.toString();
FirebaseFirestore.instance
.collection('${widget.category}${widget.usercity}')
.doc(widget.postId)
.update({'buyer.$userid': "true", 'deal': "Completed"});
Navigator.push(
this.context,
MaterialPageRoute(
builder: (context) => CategoryFeedDetail(
postId: widget.postId,
userId: widget.userId,
category: widget.category,
usercity: widget.usercity,
),
));
}
});
element.src =
'assets/payments.html?name=${widget.name}&price=${widget.price}';
element.style.border = 'none';
return element;
});
return Scaffold(body: Builder(builder: (BuildContext context) {
return Container(
child: HtmlElementView(viewType: 'rzp-html'),
);
}));
}
#override
void dispose() {
// TODO: implement dispose
super.dispose();
}
#override
bool get wantKeepAlive => false;
}
After payment the user is redirected to detail page and on detail page follwing is the code is there on back press to go on list page
Navigator.pushReplacement(
context,
MaterialPageRoute(
builder: (context) => CategoryFeed(
widget.userId, widget.usercity, widget.category),
),
);
}),