webview_flutter 违反了内容安全政策，有啥解决办法吗？

Posted 2023-02-23

【中文标题】webview_flutter 违反了内容安全政策，有啥解决办法吗？

【英文标题】：webview_flutter violates content security policy, any solutions?webview_flutter 违反了内容安全政策，有什么解决办法吗？

【发布时间】：2021-03-20 08:25:17

【问题描述】：

编辑：我特别了解了 PayPal 的错误。由于某种原因，此错误仅在使用测试卡号（在沙盒模式下）时发生，尝试使用真实的信用卡号会使错误消失。我相信这是由于 PayPal 上使用 iFrame 的新货币选择功能。

我正在使用 webview_flutter 浏览 PayPal 结帐页面。它曾经可以工作，但可能是 PayPal 方面的更新破坏了它，现在我收到以下内容安全策略错误：

cancelBuffer: slot 1
I/chromium(19561): [INFO:CONSOLE(425)] "Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src 'nonce-PHXXXXXXXXXXXXXia13HX3l2n4' 'self' https://*.paypal.com https://*.paypalobjects.com 'unsafe-inline' 'unsafe-eval'". Note that 'unsafe-inline' is ignored if either a hash or nonce value is present in the source list.
I/chromium(19561): ", source: https://www.paypal.com/webapps/xoonboarding?token=EC-1G3XXXXXX5C&country.x=CA&locale.x=en_CA&fromSignupLite=true&fallback=1&reason=dW5oYW5XXXXXZ2VuY3k%3D (425)

"Refused to connect to 'https://www.google-analytics.com/collect' because it violates the following Content Security Policy directive: "connect-src 'self' https://*.paypal.com https://*.paypalobjects.com https://*.qualtrics.com".

我尝试了不同版本的插件和不同的设备，但每次都遇到这个错误。 （当我在 PayPal 上填写付款信息后单击结帐按钮时）。

我的 Flutter 代码：

body: WebView(
          initialUrl: checkoutUrl,
          javascriptMode: JavascriptMode.unrestricted,
          navigationDelegate: (NavigationRequest request) 
            if (request.url.contains(returnURL)) 
              final uri = Uri.parse(request.url);
              final payerID = uri.queryParameters['PayerID'];
              if (payerID != null) 
                services
                    .executePayment(executeUrl, payerID, accessToken)
                    .then((id) 
                  widget.onFinish(id);
                  Navigator.of(context).pop();
                );
               else 
                Navigator.of(context).pop();
              
              Navigator.of(context).pop();
            
            if (request.url.contains(cancelURL)) 
              Navigator.of(context).pop();
            
            return NavigationDecision.navigate;
          ,
        ),

【参考方案1】：

PayPal Checkout 只能在 Safari 视图控制器或 Chrome 自定义选项卡中使用：https://developer.paypal.com/docs/api/info-security-guidelines/#secure-applications

不支持没有地址栏的 Webview，例如 WKWebView 或 android 的 Platform Views

【讨论】：

它运行了好几个月，似乎他们今天推送更新的唯一目的是破坏我的应用程序。我必须实现这些，谢谢。