时间戳

首页 > 解决方案 > Flutter webview：ssl_client_socket_impl 和 Uncaught SecurityError 错误

flutter - Flutter webview：ssl_client_socket_impl 和 Uncaught SecurityError 错误

问题描述

我正在尝试在我的颤振网页视图页面上发送 cookie。所以我安装了 webview_flutter: ^1.0.7 并且我这样使用：

  @override
  void initState() {
    super.initState();
    _controller.future.then((controller) async {
      wvc = controller;
      Map<String, String> header = {};
      // 1 :
      wvc.evaluateJavascript('document.cookie="SESSION-Test=token";');
      wvc.loadUrl("https://webmobile.parsian-bank.ir/WebView/CoTest.html");
      // 2 :
      // header = {"SESSION": "12343254"};
      // wvc.loadUrl("https://webmobile.parsian-bank.ir/WebView/CoTest.html",
      // headers: header);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
          child: WebView(
        initialMediaPlaybackPolicy: AutoMediaPlaybackPolicy.always_allow,
        debuggingEnabled: true,
        javascriptMode: JavascriptMode.unrestricted,
        onWebViewCreated: (webViewController) async {
          _controller.complete(webViewController);
        },
        onPageFinished: (val) async {
          String cookies = await wvc.evaluateJavascript('document.cookie');
          print("---> cookie is $cookies");
        },
      )),
    );
  }
}

CoTest.html 有一个简单的代码：

<!DOCTYPE html>
<html dir="rtl" lang="fa-IR" "=""><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><style class="vjs-styles-defaults">
      .video-js {
        width: 300px;
        height: 150px;
      }

      .vjs-fluid {
        padding-top: 56.25%
      }
    </style>
</head>
<body>
<script>
 document.write(  "cookies are === >>>>>>       " + document.cookie + "            <<<<<<");
 </script>cookies are === &gt;&gt;&gt;&gt;&gt;&gt;                   &lt;&lt;&lt;&lt;&lt;&lt;
</body></html>

但是当我试图显示页面时，我得到了这些错误，我只是得到一个空白屏幕：

E/chromium( 6140): [ERROR:ssl_client_socket_impl.cc(946)] handshake failed; returned -1, SSL error code 1, net_error -202
I/chromium( 6140): [INFO:CONSOLE(1)] "Uncaught SecurityError: Failed to read the 'cookie' property from 'Document': Access is denied for this document.",

这是主要清单：

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.testt">
    
    <uses-permission android:name="android.permission.INTERNET" />

    <application
        android:name="io.flutter.app.FlutterApplication"
        android:label="testt"
        android:icon="@mipmap/ic_launcher"
        android:usesCleartextTraffic="true">
        <activity
            android:name=".MainActivity"
            android:launchMode="singleTop"
            android:theme="@style/LaunchTheme"
            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
            android:hardwareAccelerated="true"
            android:windowSoftInputMode="adjustResize">
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>
                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>
        <!-- Don't delete the meta-data below.
             This is used by the Flutter tool to generate GeneratedPluginRegistrant.java -->
        <meta-data
            android:name="flutterEmbedding"
            android:value="2" />
    </application>
</manifest>

更新：

Cookie管理器的问题在IOS 11+上有效

标签： fluttersetcookieflutterwebviewplugin

解决方案

您可以使用包https://pub.dev/packages/webview_cookie_manager
可以直接 使用WebCookieManager或与webview_flutter.

从公开问题[WebView] Provide a way to set cookies https://github.com/flutter/flutter/issues/27597
当前解决方案是https://github.com/flutter/flutter/issues/27597#issuecomment-657293123
...现在您可以WebviewCookieManager使用flutter_webview

代码片段

return WebView(
  // initialUrl: '',
  onWebViewCreated: (WebViewController controller) async {
    await WebviewCookieManager().setCookies([
      Cookie('SESSION-Test', 'token')
        ..domain = 'webmobile.parsian-bank.ir'
        ..httpOnly = false
    ]);

    controller.loadUrl('https://webmobile.parsian-bank.ir/WebView/CoTest.html');
  },

webview_cookie_manager官方示例https://github.com/fryette/webview_cookie_manager/blob/master/example/lib/main.dart

webview_cookie_manager官方示例代码片段

  final String _url = 'https://youtube.com';
  final String cookieValue = 'some-cookie-value';
  final String domain = 'youtube.com';
  final String cookieName = 'some_cookie_name';

  @override
  void initState() {
    super.initState();
    cookieManager.clearCookies();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Plugin example app'),
          actions: [
            IconButton(
              icon: Icon(Icons.ac_unit),
              onPressed: () async {
                // TEST CODE
                await cookieManager.getCookies(null);
              },
            )
          ],
        ),
        body: WebView(
          initialUrl: _url,
          javascriptMode: JavascriptMode.unrestricted,
          onWebViewCreated: (controller) async {
            await cookieManager.setCookies([
              Cookie(cookieName, cookieValue)
                ..domain = domain
                ..expires = DateTime.now().add(Duration(days: 10))
                ..httpOnly = false
            ]);
          },

推荐阅读