dart Flutter Stripe检出：无法从“Document”读取“cookie”属性：在“data：”中禁用Cookie

ax6ht2ek 于 11个月前发布在 Flutter

关注(0)|答案(2)|浏览(105)

webView flutter应用Stripe Checkout

将Stripe checkout与Flutter移动的应用程序集成。在以前版本的Flutter & webview_flutter插件中使用过。
但现在它在控制台中显示此错误，并将webView卡在初始URL：

I/chromium(26312): [INFO:CONSOLE(1)] "Stripe.js requires 'allow-same-origin' if sandboxed.", source: https://js.stripe.com/v3/ (1)
I/chromium(26312): [INFO:CONSOLE(1)] "Uncaught SecurityError: Failed to read the 'cookie' property from 'Document': Cookies are disabled inside 'data:' URLs.", source: https://js.stripe.com/v3/ (1)

字符串

Webview Stripe Checkout的Flutter代码

class StripePaymentCheckout extends StatefulWidget {
  final String sessionId;

  const StripePaymentCheckout({Key key, this.sessionId}) : super(key: key);
  @override
  _StripePaymentCheckoutState createState() => _StripePaymentCheckoutState();
}

class _StripePaymentCheckoutState extends State<StripePaymentCheckout> {
  WebViewController _webViewController;

  String get initialUrl =>
      "data:text/html;base64,${base64Encode(const Utf8Encoder().convert(kStripeHTMLPage))}";

  static const String kStripeHTMLPage = '''
  <!DOCTYPE html>
  <html>
  <script src="https://js.stripe.com/v3/"></script>

  <head>
      <title>Stripe Checkout</title>
  </head>

  <body>
      <div style="position: absolute; text-align: center; width:100%; height:100%; top:50%;">
          <h1>Loading Stripe...!</h1>
      </div>
  </body>

  </html>
  ''';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
      body: SafeArea(
        child: WebView(
          initialCookies: [
            WebViewCookie(
              name: 'sessionid',
              value: widget.sessionId,
              domain: 'https://js.stripe.com/v3/',  // <-- not sure what to do here.
            ),
          ],
          initialUrl: initialUrl,
          javascriptMode: JavascriptMode.unrestricted,
          onWebViewCreated: (webViewController) {
            _webViewController = webViewController;
          },
          onPageFinished: (String url) {
            if (url == initialUrl) {
              _redirectToStripe(widget.sessionId);
            }
          },
          navigationDelegate: (NavigationRequest request) {
            if (request.url.startsWith('https://success.com')) {
              Navigator.of(context).pop("success");
            } else if (request.url.startsWith('https://cancel.com')) {
              Navigator.of(context).pop('cancel');
            }
            return NavigationDecision.navigate;
          },
        ),
      ),
    );
  }

  Future<void> _redirectToStripe(String sessionId) async {
    final redirectToCheckoutJs = '''
    var stripe = Stripe('${dotenv.env['apiKey']}');
    
    stripe.redirectToCheckout({
      sessionId: '$sessionId'
    }).then(function (result) {
        result.error.message = 'Error'
    });
    ''';

    return await _webViewController
        .runJavascriptReturningResult(redirectToCheckoutJs);
  }
}

型

dart

来源：https://stackoverflow.com/questions/71495676/flutter-stripe-checkout-failed-to-read-the-cookie-property-from-document-c

2条答案

按热度按时间

ql3eal8s1#

代码：

<!DOCTYPE html>
  <html>
  <script src="https://js.stripe.com/v3/"></script>

  <head>
      <title>Stripe Checkout</title>
  </head>

  <body>
      <div style="position: absolute; text-align: center; width:100%; height:100%; top:50%;">
          <h1>Loading Stripe...!</h1>
      </div>
  </body>

  </html>

字符串
需要部署在https上才能使代码正常工作。有一个人提出了同样的问题，并用代码解决了这个问题，你可以在这里找到：
https://github.com/MarcinusX/flutter_stripe_demo/blob/master/lib/checkout/stripe_checkout_mobile.dart
并且他已经在上面托管了所需的代码：
https://marcinusx.github.io/test1/index.html的

赞(0）回复(0）举报 11个月前

jbose2ul2#

我假设这是各种语言（如PHP）的类型转换，可能stripe在此服务中使用PHP，因此：