我有一个简单的 Flutter WebView 应用程序来显示我的网站。问题是，在我的网站中，我有两个功能可以打开一个新的浏览器窗口。
例如，其中之一是 facebook 登录功能，当用户点击使用 facebook 登录时，它会加载 facebook 登录 api 页面，登录完成后，它告诉用户返回另一个页面，但正如我在 WebView 中，我无法返回另一个页面。
有什么方法可以让我在 Flutter 上打开 2 个 WebView 来加载不同的页面？如果没有，这个问题还有其他可能的解决方案吗？
该webview_flutter插件不提供在新窗口打开时管理和拦截的事件，例如，当您单击带有JavaScript 端的链接按钮target="_blank"或调用时。window.open()
所以，你可以使用我的插件flutter_inappwebview，它是一个 Flutter 插件，允许你添加内联 WebView 或打开应用内浏览器窗口，并且有很多事件、方法和选项来控制 WebView。
\n它实现了onCreateWindow\xc2\xa0event，这是当 WebView 请求主机应用程序创建新窗口时触发的事件，例如当尝试打开链接target="_blank"或window.open()由 JavaScript 端调用时。
下面是一个示例，我加载了一个简单的初始 HTML（只是为了示例），该 HTML 有一个按钮<button id="login-button">LOGIN</button>，单击该按钮时，它会在AlertDialog. onLoadStop使用这个新的 WebView，您可以通过\xc2\xa0event 或使用该事件监听 URL 更改shouldOverrideUrlLoading，或者您可以在用户登录后检查并获取特定的 cookie。您可以在这个新的 WebView 中放置任何逻辑。
这是代码示例：
\nimport \'dart:async\';\nimport \'package:flutter/material.dart\';\nimport \'package:flutter_inappwebview/flutter_inappwebview.dart\';\n\nFuture main() async {\n WidgetsFlutterBinding.ensureInitialized();\n runApp(MyApp());\n}\n\nclass MyApp extends StatefulWidget {\n @override\n _MyAppState createState() => new _MyAppState();\n}\n\nclass _MyAppState extends State<MyApp> {\n @override\n void initState() {\n super.initState();\n }\n\n @override\n void dispose() {\n super.dispose();\n }\n\n @override\n Widget build(BuildContext context) {\n return MaterialApp(initialRoute: \'/\', routes: {\n \'/\': (context) => InAppWebViewExampleScreen(),\n });\n }\n}\n\nclass InAppWebViewExampleScreen extends StatefulWidget {\n @override\n _InAppWebViewExampleScreenState createState() =>\n new _InAppWebViewExampleScreenState();\n}\n\nclass _InAppWebViewExampleScreenState extends State<InAppWebViewExampleScreen> {\n InAppWebViewController _webViewController;\n CookieManager _cookieManager = CookieManager.instance();\n\n @override\n void initState() {\n super.initState();\n }\n\n @override\n void dispose() {\n super.dispose();\n }\n\n @override\n Widget build(BuildContext context) {\n return Scaffold(\n appBar: AppBar(title: Text("InAppWebView")),\n body: Container(\n child: Column(children: <Widget>[\n Expanded(\n child: InAppWebView(\n initialData: InAppWebViewInitialData(data: """\n<!DOCTYPE html>\n<html lang="en">\n <head>\n <meta charset="UTF-8">\n <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">\n <meta http-equiv="X-UA-Compatible" content="ie=edge">\n <title>InAppWebViewInitialDataTest</title>\n </head>\n <body>\n <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dolor diam, interdum vitae pellentesque sit amet, scelerisque at magna. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>\n <p>Nullam vitae fringilla mauris, eu efficitur erat. Nulla aliquam ligula nec leo ornare varius. Curabitur ornare ultrices convallis.</p>\n <button id="login-button">LOGIN</button>\n <script>\n document.querySelector(\'#login-button\').addEventListener(\'click\', function (event) {\n window.open(\'https://github.com/\', \'_blank\');\n });\n </script>\n </body>\n</html>\n """),\n initialHeaders: {},\n initialOptions: InAppWebViewGroupOptions(\n crossPlatform: InAppWebViewOptions(\n debuggingEnabled: true,\n ),\n android:\n AndroidInAppWebViewOptions(supportMultipleWindows: true)),\n onWebViewCreated: (InAppWebViewController controller) {\n _webViewController = controller;\n },\n onLoadStart: (InAppWebViewController controller, String url) {\n\n },\n onLoadStop: (InAppWebViewController controller, String url) {\n\n },\n onCreateWindow: (controller, onCreateWindowRequest) {\n showDialog(\n context: context,\n builder: (context) {\n return AlertDialog(\n content: Container(\n width: 700,\n child: Column(children: <Widget>[\n Expanded(\n child: InAppWebView(\n initialUrl: onCreateWindowRequest.url,\n initialOptions: InAppWebViewGroupOptions(\n crossPlatform: InAppWebViewOptions(\n debuggingEnabled: true,\n useShouldOverrideUrlLoading: true)),\n onLoadStart: (InAppWebViewController controller,\n String url) {},\n onLoadStop: (controller, url) async {\n print(url);\n if (url == "myURL") {\n Navigator.pop(context);\n return;\n }\n\n var loggedInCookie = await _cookieManager.getCookie(url: url, name: "logged_in");\n if (loggedInCookie.value == "yes") {\n Navigator.pop(context);\n return;\n }\n },\n shouldOverrideUrlLoading: (controller,\n shouldOverrideUrlLoadingRequest) async {\n print(shouldOverrideUrlLoadingRequest.url);\n if (shouldOverrideUrlLoadingRequest.url == "myURL") {\n Navigator.pop(context);\n }\n return ShouldOverrideUrlLoadingAction.ALLOW;\n },\n ))\n ])));\n },\n );\n },\n ))\n ])));\n }\n}\n| 归档时间： |
|
| 查看次数： |
1560 次 |
| 最近记录： |