托管HTML内容的图形用户界面中的元素。对于Android,请查看android-webview标签。对于iOS,请查看uiwebview或wkwebview。
为什么 .NET MAUI WebView 无法打开非其来源网站的链接?
我正在使用 Visual Studio 2022 开发一个包含 WebView 对象的 NET MAUI 移动应用程序。 源网站 mywebsite.com 已正确加载,并且其所有内部链接均有效。 我的目标是...
如何在flutter web中检测InAppWebView中的滚动事件?
我想知道用户何时滚动webview,以便我可以处理一些操作。但目前我无法检测到滚动事件。 InAppWebView( onScrollChanged:(控制器,我...
我想知道用户何时结束在显示条款和条件的 Web 视图上的滚动,以便仅当用户阅读此内容时才显示“接受”按钮。 我想知道用户何时结束在显示条款和条件的 Web 视图上的滚动,以便仅当用户阅读此内容时才显示“接受”按钮。 <StackLayout Spacing="0" BackgroundColor="{StaticResource WhiteColor}"> <CustomView:HeaderView VerticalOptions="Start" LeftImageSource="{Binding LeftImage}" RightImageSource="{Binding RightImage}" LeftCommand="{Binding LeftClickCommand}" RightCommand="{Binding RightClickCommand}" HeaderText="{Binding ScreenTitle}" PrevText="{Localize:ETranslate PrevText}" /> <WebView Source="{Binding Html, Converter={StaticResource HtmlSourceConverter}}" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" /> </StackLayout> public class HtmlSourceConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, CultureInfo culture) { var html = new HtmlWebViewSource(); if (value != null) { html.Html = value.ToString(); } return html; } public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) { throw new NotImplementedException(); } } 我尝试使用 Renderer 来实现此目的,但在 iOS WkWebViewRenderer 中没有 WebViewRenderer 中可用的 Scrolled() 方法。 有什么方法可以在 Xamarin.Forms 中实现这一点吗? WKWebView 内部有一个属性 ScrollView,所以我们可以用它覆盖 Delegate。 WKWebViewRenderer 中的代码 [assembly: ExportRenderer(typeof(WebView), typeof(MyRenderer))] namespace FormsA.iOS { public class MyDelegate : UIScrollViewDelegate { public override void Scrolled(UIScrollView scrollView) { if(scrollView.ContentOffset.Y >= scrollView.ContentSize.Height - scrollView.Frame.Size.Height) { //here rearch bottom } else if(scrollView.ContentOffset.Y < scrollView.ContentSize.Height) { } } } public class MyRenderer: WkWebViewRenderer { protected override void OnElementChanged(VisualElementChangedEventArgs e) { base.OnElementChanged(e); this.ScrollView.Delegate = new MyDelegate(); } } } 它在我这边工作得很好,请参阅https://stackoverflow.com/a/52872317/8187800. 我也有 Android 的解决方案。这是完整的解决方案,希望这对寻找相同解决方案的人有帮助! MyPage.xaml <webview:ScrollWebView x:Name="webView" Source="{Binding Html, Converter={StaticResource HtmlSourceConverter}}" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" IsBottomReached="{Binding IsShowAgreeButton}"/> ScrollWebView 控件 public class ScrollWebView : WebView { public static BindableProperty IsBottomReachedProperty = BindableProperty.Create(nameof(IsBottomReached), typeof(bool), typeof(ScrollWebView), default(bool), BindingMode.TwoWay, propertyChanged: null); public bool IsBottomReached { get { return (bool)GetValue(IsBottomReachedProperty); } set { SetValue(IsBottomReachedProperty, value); } } } Android:ScrollWebViewRenderer [assembly: Xamarin.Forms.ExportRenderer(typeof(ScrollWebView), typeof(ScrollWebViewRenderer))] namespace MyApp.Droid { public class ScrollWebViewRenderer : WebViewRenderer { public static ScrollWebView view = null; public ScrollWebViewRenderer(Context context) : base(context) { } protected override void OnElementChanged(ElementChangedEventArgs<WebView> e) { base.OnElementChanged(e); view = (ScrollWebView)Element; if (Control != null) { Control.ScrollChange += Control_ScrollChange; } } private void Control_ScrollChange(object sender, ScrollChangeEventArgs e) { var nativeWebView = e.V as global::Android.Webkit.WebView; int height = (int)Math.Floor(nativeWebView.ContentHeight * nativeWebView.Scale); int webViewheight = nativeWebView.Height; int cutOff = height - webViewheight; if (e.ScrollY >= cutOff) { view.IsBottomReached = true; System.Diagnostics.Debug.WriteLine("Bottom Reached"); } else { view.IsBottomReached = false; } } } } iOS:ScrollWebViewRenderer [assembly: ExportRenderer(typeof(ScrollWebView), typeof(ScrollWebViewRenderer))] namespace MyApp.iOS.RendererClasses { public class ScrollWebViewRenderer : WkWebViewRenderer { public static ScrollWebView view = null; public ScrollWebViewRenderer() { } protected override void OnElementChanged(VisualElementChangedEventArgs e) { base.OnElementChanged(e); view = (ScrollWebView)Element; MyDelegate myDel = new MyDelegate(); myDel.ProcessCompleted += MyDel_ProcessCompleted; this.ScrollView.Delegate = myDel; } private void MyDel_ProcessCompleted(object sender, bool isScrolledToBottom) { view.IsBottomReached = isScrolledToBottom; } } public class MyDelegate : UIScrollViewDelegate { public event EventHandler<bool> ProcessCompleted; public override void Scrolled(UIScrollView scrollView) { if (scrollView.ContentOffset.Y >= scrollView.ContentSize.Height - scrollView.Frame.Size.Height) { System.Diagnostics.Debug.WriteLine("Bottom Reached"); ProcessCompleted?.Invoke(this, true); } else { ProcessCompleted?.Invoke(this, false); } } } } 实现这个答案后,https://stackoverflow.com/a/66931493/15125666我仍然遇到Android渲染器的问题,因为它没有检测到用户何时到达WebView的底部。 为了解决这个问题,您需要在计算中添加一个缓冲区,这将在将内容高度乘以比例时考虑任何潜在的浮点错误。 这里是 Android 的更新代码:ScrollWebViewRenderer private void Control_ScrollChange(object sender, ScrollChangeEventArgs e) { var nativeWebView = e.V as global::Android.Webkit.WebView; int height = (int)(nativeWebView.ContentHeight * nativeWebView.Scale); int webViewheight = nativeWebView.Height; int bottomThreshold = (int)Math.Floor(0.004 * webViewheight); // the number that I used 0.004 was what worked for me. you might need to adjust it for your use case. int cutOff = height - webViewheight - bottomThreshold; if (e.ScrollY >= cutOff) { view.IsBottomReached = true; System.Diagnostics.Debug.WriteLine("Bottom Reached"); } else { view.IsBottomReached = false; } } 这里我添加了一个动态 bottomThreshold 缓冲区,并将其用于 cutOff 计算。它在计算中添加了一个小缓冲区,以确保即使很小的差异也不会妨碍到达底部的检测。
当我使用 flutter 的 InAppWebView 包加载页面时,我试图拦截特定的 post 请求并获取它的正文。 在 iOS 上,此解决方案使用“shouldOverrideUrlLoading”来 c...
如何在应用内 Chromium 浏览器中启用通知模块? (未捕获的引用错误:未定义通知)
我正在开发一个具有基于 Chromium 的应用内浏览器的应用程序。我需要允许用户通过这个兄弟与某个网页/服务器(我没有内部访问权限)进行交互......
将数据从 React Native 发送到 WebView 渲染的 React 应用程序时遇到问题
我正在开发一个项目,需要将数据(特别是陀螺仪数据)从 React Native 应用程序发送到在 WebView 内呈现的 React 应用程序。然而,我在成功方面遇到了困难
我正在使用谷歌登录我的应用程序,并且登录页面正在加载 Flutter 自定义选项卡包。我的页面已成功加载,但我想以编程方式关闭选项卡并将其路由到...
如何在 Flutter 中实现 WebView 中的 UI 现代化?我在 Flutter 中的 WebView 控制器看起来太旧了
Android 的问题 我在 Flutter 中遇到了 WebView 控制器的问题。它看起来已经过时了,我想知道如何使其外观现代化。我已经广泛研究了这个问题......
使用本地 CSS 在应用程序中显示站点(使用 Android Studio)
我有一个专为在移动设备上显示而设计的网站。所以我决定使用 Android Studio。 我想显示我的 html 文件,从服务器实时显示,但应用程序中有本地 css 和 js 文件...
flutter admob/webview 在应用程序从后台恢复后显示空白页面
应用程序从后台恢复后,BannerAd 显示空白的黑色页面。 据我所知,google_mobile_ads正在flutter中使用webview_flutter包。正如所料,同样的问题...
WebView 在 Android 13 系统 App 中无法运行
我正在使用 Web 视图在我的应用程序中加载 URL。但由于我的应用程序是系统应用程序,它无法正常工作。当我尝试删除 ' android:sharedUserId="android.uid.system" ' 这个标签后
在 Flutter Webview 中运行一些 Javascript
如何在flutter_webview_plugin中运行Javascript?我尝试过这个: 按下时:() { flutterWebviewPlugin.evalJavascript(' <p>如何在 flutter_webview_plugin 中运行 Javascript?我尝试过这个:</p> <pre><code>onPressed: () { flutterWebviewPlugin.evalJavascript('<script language="JavaScript" type="text/javascript">alert("Hello World")</script>'); }, </code></pre> <p>但是什么也没发生。</p> <p>我认为使用 <pre><code>flutterWebviewPlugin.evalJavascript</code></pre> 可以在 Web 视图中运行 Javascript。 我做错什么了吗?</p> </question> <answer tick="true" vote="21"> <pre><code>flutterWebviewPlugin.evalJavascript('<script language="JavaScript" type="text/javascript">alert("Hello World")</script>') </code></pre> <p>需要 JavaScript,而不是 HTML</p> <pre><code><script language="JavaScript" type="text/javascript">alert("Hello World")</script> </code></pre> <p>是 HTML。</p> <p>尝试</p> <pre><code>flutterWebviewPlugin.evalJavascript('alert("Hello World")') </code></pre> </answer> <answer tick="false" vote="4"> <p>你可以尝试我的插件<a href="https://github.com/pichillilorenzo/flutter_inappwebview" rel="nofollow noreferrer">flutter_inappwebview</a>,这是一个 Flutter 插件,允许你添加内联 WebView 或打开应用内浏览器窗口,并且有很多事件、方法和选项来控制 WebView。</p> <p>要运行一些js,你可以使用:</p> <ul> <li><pre><code>Future<dynamic> evaluateJavascript({@required String source})</code></pre>:将 JavaScript 代码评估到 WebView 中并返回评估结果。</li> <li><pre><code>Future<void> injectJavascriptFileFromUrl({@required String urlFile})</code></pre>:从定义的 url 将外部 JavaScript 文件注入到 WebView 中。</li> <li><pre><code>Future<void> injectJavascriptFileFromAsset({@required String assetFilePath})</code></pre>:从 flutter 资产目录将 JavaScript 文件注入到 WebView 中(有关如何从资产文件夹加载文件的更多信息,请参阅<a href="https://github.com/pichillilorenzo/flutter_inappwebview#load-a-file-inside-assets-folder" rel="nofollow noreferrer">here</a>)。</li> </ul> <p>完整示例:</p> <pre><code>import 'dart:async'; import 'package:flutter/material.dart'; import 'package:flutter_inappwebview/flutter_inappwebview.dart'; Future main() async { runApp(new MyApp()); } class MyApp extends StatefulWidget { @override _MyAppState createState() => new _MyAppState(); } class _MyAppState extends State<MyApp> { @override void initState() { super.initState(); } @override void dispose() { super.dispose(); } @override Widget build(BuildContext context) { return MaterialApp( home: InAppWebViewPage() ); } } class InAppWebViewPage extends StatefulWidget { @override _InAppWebViewPageState createState() => new _InAppWebViewPageState(); } class _InAppWebViewPageState extends State<InAppWebViewPage> { InAppWebViewController webView; @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text("InAppWebView") ), body: Container( child: Column(children: <Widget>[ Expanded( child: Container( child: InAppWebView( initialUrl: "https://www.example.org/", initialHeaders: {}, initialOptions: InAppWebViewWidgetOptions( inAppWebViewOptions: InAppWebViewOptions( debuggingEnabled: true, ), ), onWebViewCreated: (InAppWebViewController controller) { webView = controller; }, onLoadStart: (InAppWebViewController controller, String url) { }, onLoadStop: (InAppWebViewController controller, String url) async { int result1 = await controller.evaluateJavascript(source: "10 + 20;"); print(result1); // 30 String result2 = await controller.evaluateJavascript(source: """ var firstname = "Foo"; var lastname = "Bar"; firstname + " " + lastname; """); print(result2); // Foo Bar // inject javascript file from an url await controller.injectJavascriptFileFromUrl(urlFile: "https://code.jquery.com/jquery-3.3.1.min.js"); // wait for jquery to be loaded await Future.delayed(Duration(milliseconds: 1000)); String result3 = await controller.evaluateJavascript(source: "\$('body').html();"); print(result3); // prints the body html // inject javascript file from assets folder await controller.injectJavascriptFileFromAsset(assetFilePath: "assets/myJavascriptFile.js"); }, ), ), ), ])) ); } } </code></pre> </answer> <answer tick="false" vote="2"> <p>这就是您的 Webview 小部件应该的样子</p> <pre><code>WebView( initialUrl: 'http://<domain>', javascriptMode: JavascriptMode.unrestricted, onWebViewCreated: (WebViewController webViewController) { webViewController.evaluateJavascript( 'alert('hello from flutter)'); } </code></pre> <p>在代码中的任何位置使用<pre><code>webViewController</code></pre></p> </answer> <answer tick="false" vote="1"> <p>好吧,什么也没发生,因为 flutter webview 不支持 javascript 警报功能。尝试编写一个 JavaScript 函数来更改 HTML 元素的 innerText 值,然后使用 .evalJavascript 调用该函数以查看结果。</p> </answer> <answer tick="false" vote="1"> <p>我使用 <strong>webview_flutter</strong> 实现 <strong>onPressed</strong> 函数的最佳方法。使用 '<strong>runJavascript</strong>' 或 <strong>evaluateJavascript</strong> 或 '<strong>runJavascriptReturningResult</strong>':</p> <pre><code>import 'package:flutter/material.dart'; import 'dart:io'; import 'package:webview_flutter/webview_flutter.dart'; import 'package:flutter/services.dart'; dynamic ctrl; // Created here to keep working with Hot Reload void main() { runApp( MaterialApp( home: WebViewExample(), ), ); } class WebViewExample extends StatefulWidget { @override WebViewExampleState createState() => WebViewExampleState(); } class WebViewExampleState extends State<WebViewExample> { @override void initState() { super.initState(); // Enable virtual display. if (Platform.isAndroid) WebView.platform = AndroidWebView(); } @override Widget build(BuildContext context) { void runJS(command) async { ctrl.runJavascript(command); // If you get any result // dynamic r = await ctrl.runJavascriptReturningResult(command); // print(r); } return Scaffold( appBar: AppBar( title: Container( child: ElevatedButton( onPressed: () => { runJS('alert("Hello: Button Clicked! "+new Date())') }, child: const Text('Click on the button'), ), )), body: WebView( initialUrl: 'https://www.google.com', debuggingEnabled: true, onWebViewCreated: (WebViewController webViewController) { ctrl = webViewController; ctrl.runJavascript('alert("Hello: created!")'); // ctrl.evaluateJavascript('alert("Hello: created!")'); // ctrl.runJavascriptReturningResult('alert("Hello: created!")'); }, onPageStarted: (String url) async { // ctrl.runJavascript('alert("Hello: started!")'); // ctrl.evaluateJavascript('alert("Hello: started!")'); // ctrl.runJavascriptReturningResult('alert("Hello: started!")'); }, onPageFinished: (String url) async { // ctrl.runJavascript('alert("Hello: finished!")'); // ctrl.evaluateJavascript('alert("Hello: finished!")'); // ctrl.runJavascriptReturningResult('alert("Hello: finished!")'); }, ), ); } } </code></pre> </answer> <answer tick="false" vote="0"> <p>我已经用 iOS 部分进行了调试 <pre><code>flutter_webview_plugin</code></pre>。</p> <h3>iOS部分</h3> <p>发现它与iOS本机部分相关<a href="https://stackoverflow.com/a/27067168/1530581">iOS WKWebView未显示javascriptalert()对话框 </a>.</p> <p>实现代码的好示例位于<a href="https://gist.github.com/davbeck/8613f2e74e8fc335c14d" rel="nofollow noreferrer">gist</a>。</p> <p>我为此创建了一个<a href="https://github.com/fluttercommunity/flutter_webview_plugin/pull/522" rel="nofollow noreferrer">修复</a>。</p> <h3>临时解决方案</h3> <p>你可以使用</p> <pre><code>flutter_webview_plugin: git: ref: "dev/fix_alert_not_work_in_webview" url: "https://github.com/jerryzhoujw/flutter_webview_plugin" source: git </code></pre> <p>这是合并之前<pre><code>pubspec.yaml</code></pre>中的临时值<a href="https://github.com/fluttercommunity/flutter_webview_plugin/pull/522" rel="nofollow noreferrer">PR</a>。</p> </answer> <answer tick="false" vote="0"> <p>我通过将自定义 javascript 函数注册到全局窗口对象来实现此功能。</p> <pre><code> window.onMessageSending = (running)=> { console.log("state is running") } </code></pre> <p>然后我这样调用flutter_webview小部件:</p> <pre><code> _controller = WebViewController() ..setJavaScriptMode(JavaScriptMode.unrestricted) ..setNavigationDelegate(NavigationDelegate( onPageStarted: (String url) {}, onPageFinished: (String url) { }, )); _controller.runJavaScript("onMessageSending(true)"); </code></pre> </answer> </body></html>
我正在 raspi 上创建一个网络服务器,可以通过 Android 手机中的网络视图访问它。这是我的JS。 设置间隔(函数(){ 通知(); $("#position").load('refresh.php'); },1000); 功能
Flutter flutter_html 包不适用于 api
HTML( 数据: ””” ${cubit.umrapages![cubit.currentPageIndex].content} """,
我正在遵循本教程,以便可以从 WebView 添加日历事件。我知道该方法正在使用 shouldOverrideUrlLoading 作为 url date:。 公共布尔值 shouldOverrideUrlL...
MAUI.NET - IOS - 为什么当 ssl 证书无效时 Webview 显示黑屏?
我是 Maui.net 的新手,想为 ios 编写一个应用程序,该应用程序显示一个 web 视图,其中显示没有有效 ssl 证书的网站。 我已经成功地为 Android 做到了这一点。
我的应用程序有权访问位置。 我的应用程序有权访问位置。 <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" /> <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" /> 我检查用户是否已授予权限,如果没有,我将致电: await Permissions.RequestAsync<Permissions.LocationWhenInUse>(); 但是在想要访问设备位置的WebView控件中打开网页不起作用,我总是得到: User denied the request for Geolocation 我需要添加/更改什么才能从 WebView 控件读取设备位置? 您可以尝试打开Setting应用程序来启用该应用程序的权限访问。 您可以启用第一个选项或第二个选项,如下所示:
如何让我的网站在 Android 上的 telegram webview 中工作?
因此,我能够将 nginx 服务器设置为一些带有根受信任证书的虚拟 html,并且可以从浏览器访问它并显示为安全的。问题是我希望它作为电报实现......
错误:未为类“_PaymentScreenState”定义方法“WebView”
我需要帮助来实现 Webview 的更新版本,该版本分为两部分。该错误将 webview 突出显示为未定义。当我尝试实施新版本时,我不断收到……
我试图在 webview 中使用 url 显示 pdf 文件。虽然 WebView 正在加载像 google.com 这样的网页,但当我尝试加载 pdf 的 url 时,它不会加载任何内容或抛出任何异常...