我试图通过URL显示webview中的网页。我尝试过flutter_webview_plugin插件,但当我在浏览器上运行该项目时,它不工作。在flutter web应用程序中显示网页还有别的方法吗?
webview
flutter_webview_plugin
vh0rcniy1#
flutter_webview_plugin用于在应用程序中嵌入网页。在flutter web中,您应该使用HtmlElementView widget。大多数演示都使用IFrameElement来嵌入网页。您可以检查这个easy_web_view包是否自动处理移动的和Web平台。它在内部根据部署情况自动使用HTMLElementView和WebView。一些示例是可用here
HtmlElementView
IFrameElement
HTMLElementView
WebView
更新以添加onLoad侦听器
IFrameElement iframeElement = IFrameElement() ..src = 'url' ..style.border = 'none' ..onLoad.listen((event) { // perform you logic here. }); ui.platformViewRegistry.registerViewFactory( 'webpage', (int viewId) => iframeElement, ); return Directionality( textDirection: TextDirection.ltr, child: Center( child: SizedBox( width: double.infinity, height: double.infinity, child: HtmlElementView(viewType: 'webpage'), ), ), );
mwecs4sa2#
如果有人面临加载移动的端的问题,那么就用这个,它在Flutter Android,iOS,Web中工作:-
EasyWebView( height: 400, width: 1000, isHtml: false, // Use Html syntax isMarkdown: false, // Use markdown syntax convertToWidgets: true, src: Uri.dataFromString('<html><body><iframe allow="camera *;microphone *" height="100%" width="100%"' ' frameborder="0" src="$url"></iframe></body></html>', mimeType: 'text/html').toString(), ),
你们可以使用任何webview加载任何网页在您的网站/应用程序在flutter使用Url在html只需更改src =“$url”:)
42fyovps3#
2023年的答案flutter_inappwebview包刚刚增加了对web的支持!您可以在Flutter InappWebView官方文档中阅读网页设置说明,但总结如下:
<head> <!-- ... --> <script type="application/javascript" src="/assets/packages/flutter_inappwebview/assets/web/web_support.js" defer></script> <!-- ... --> </head>
Scaffold( body: SafeArea( child: InAppWebView( initialUrlRequest: URLRequest(url:WebUri('https://flutter.dev/')), ) ) );
请注意,在WebView和Flutter网页中可以做的事情有一些限制,但对于简单地显示内容来说,这应该是可行的。
3条答案
按热度按时间vh0rcniy1#
flutter_webview_plugin用于在应用程序中嵌入网页。在flutter web中,您应该使用
HtmlElementView
widget。大多数演示都使用IFrameElement
来嵌入网页。您可以检查这个easy_web_view包是否自动处理移动的和Web平台。它在内部根据部署情况自动使用HTMLElementView
和WebView
。一些示例是可用here
更新以添加onLoad侦听器
mwecs4sa2#
如果有人面临加载移动的端的问题,那么就用这个,它在Flutter Android,iOS,Web中工作:-
你们可以使用任何webview加载任何网页在您的网站/应用程序在flutter使用Url在html只需更改src =“$url”:)
42fyovps3#
2023年的答案
flutter_inappwebview包刚刚增加了对web的支持!
您可以在Flutter InappWebView官方文档中阅读网页设置说明,但总结如下:
1.将脚本添加到
2.使用InAppWebView小部件
请注意,在WebView和Flutter网页中可以做的事情有一些限制,但对于简单地显示内容来说,这应该是可行的。