从 web 视图中注销以颤振

Question

I/chromium( 4243): [INFO:CONSOLE(34)] "Uncaught TypeError: JSReceiver.Disconnect is not a function", source: https://myUrl......

我正在使用带有 Flutter 的 webview，我想与 webview 中的函数 javascript 进行交互并将其发送到 flutter。换句话说，我想与 webview 断开连接。

在我的网络视图中我正在使用

<div class="menuopt" onclick="JSReceiver.Disconnect();">Logout</div>

到目前为止我在 Flutter 中所做的尝试：

WebView(
                      initialUrl:
                          'https://www.url/insert.html?token=$token&id_user=$id',
                      javascriptMode: JavascriptMode.unrestricted,
                      onWebViewCreated: (WebViewController webViewController) {
                        _controler.complete(webViewController);
                      },
                      javascriptChannels: Set.from([
                        JavascriptChannel(
                            name: 'JSReceiver',
                            onMessageReceived: (JavascriptMessage message) {
                              Disconect(){
                              sharedPreferences.clear();
                              Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(builder: (BuildContext context) => LoginPage()), (Route<dynamic> route) => false);
                              print("disconnect");
                            }}
                            )
                      ]),

                    );

Answer 1

尽管我不清楚Disconnect(){...} 的语法，但我认为正确的实现应该是这样的：

WebView(
  initialUrl:
      'https://www.url/insert.html?token=$token&id_user=$id',
  javascriptMode: JavascriptMode.unrestricted,
  onWebViewCreated: (WebViewController webViewController) {
    _controler.complete(webViewController);
  },
  javascriptChannels: Set.from(
    [
      JavascriptChannel(
          name: 'JSReceiver',
          onMessageReceived: (JavascriptMessage message) {
            if (message == "disconnect"){
            sharedPreferences.clear();
            Navigator.of(context).pushAndRemoveUntil(
              MaterialPageRoute(builder: (BuildContext context) => LoginPage()), 
              (Route<dynamic> route) => false,
            );
            print("disconnect");
          }
        }
      )
    ],
  ),
);

并且，在 JavaScript 方面，你可以这样做：

JsReceiver.postMessage('disconnect');

虽然我从未使用过webview_flutter（我使用过flutter_webview_plugin）并且没有明确的文档，但我的回答是基于：

• this example from their repo
• this comment on the JavaScript channels feature request
• 该过程应该类似于the process in flutter_webview_plugin中的过程这一事实

希望这会有所帮助！