I am trying integrate stripe checkout in my Flutter app. I can't use the flutter_stripe because I am trying to setup a subscription. The checkout session id is being generated just fine on the server end. However on the client end I am getting this error:
I/chromium(13817): [INFO:CONSOLE(1)] "Unrecognized feature: 'payment'.", source: https://js.stripe.com/v3/ (1)
I can't seem to find much related to this error. Even Stripe support is stumped. What am I doing wrong?
import 'package:flutter/cupertino.dart';
import 'package:webview_flutter/webview_flutter.dart';
class CheckoutPage extends StatefulWidget {
const CheckoutPage({
this.pubKey,
this.checkoutSessionId,
Key key,
}) : super(key: key);
final String pubKey;
final String checkoutSessionId;
@override
_CheckoutPageState createState() => _CheckoutPageState();
}
class _CheckoutPageState extends State<CheckoutPage> {
WebViewController _controller;
void _stripeRedirect() async {
final stripeJs = '''
const stripe = Stripe("${widget.pubKey}");
stripe.reditrectToCheckout({
sessionId: "${widget.checkoutSessionId}"
}).then(function (result) {
if (result.error) {
return result.error.message;
}
return "Success";
});
}
''';
final resolve = await _controller.evaluateJavascript(stripeJs);
print(resolve);
}
@override
Widget build(BuildContext context) {
final String initialUrl = 'https://mywebsite.com/checkout/ ';
return SafeArea(
child: CupertinoPageScaffold(
navigationBar: CupertinoNavigationBar(
middle: const Text('checkout'),
),
child: WebView(
initialUrl: initialUrl,
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (controller) => _controller = controller,
onPageFinished: (url) {
if (url == initialUrl) {
_stripeRedirect();
}
},
navigationDelegate: (req) {
if (req.url.contains('success')) {
Navigator.pop(context, 'success');
}
if (req.url.contains('cancel')) {
Navigator.pop(context, 'cancel');
}
return NavigationDecision.navigate;
},
),
),
);
}
}
<!DOCTYPE html>
<html>
<script src="https://js.stripe.com/v3/"></script>
<head>
<title>Stripe checkout</title>
</head>
<body>
<p>Loading, please wait...</p>
</body>
</html>
Not really sure about this one but it could be related to Feature-Policy and how Flutter’s webview enforces it. Might wanna check in with the Flutter Community to see if they can shed any light on this.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With