CODEWITHSUNDEEP
flutterstripe-paymentsflutterwebviewplugin
Mudassir
Mudassir

Reputation: 806

"Unrecognized feature: 'payment'.", source: https://js.stripe.com/v3/ (1)

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?

WebView Code

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;
          },
        ),
      ),
    );
  }
}

Landing Page

<!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>

Upvotes: 3

Views: 1621

Answers (1)

hanzo
hanzo

Reputation: 844

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.

Upvotes: 2

Related Questions