UWP 中使用 WebView 时可以在网页中额外执行一些代码。于是你几乎可以在网页上做任何事情,那些你可以在浏览器控制台中做的事情。
本文将介绍做法。
准备环境
在页面(XAML)中放一个 WebView
,然后取个名字,比如就叫做 WebView
。
监听 NavigationCompleted
事件,然后导航到需要操作的页面。
WebView.NavigationCompleted += OnNavigationCompleted;
WebView.Navigate(new Uri("https://walterlv.com"));
private async void OnNavigationCompleted(WebView sender, WebViewNavigationCompletedEventArgs e)
{
// 我们接下来的代码都将在这里编写。
}
要执行 JavaScript 代码,必须要导航完成才行,所以我们接下来的代码都是写在 NavigationCompleted
事件处理函数中的。
执行 JavaScript 代码
模拟用户输入
下面这一句的代码是填充用户 Id 一栏:
await WebView.InvokeScriptAsync("eval", new[]
{
"document.getElementById('userId').value = 'walterlv';"
});
登录页面截图来自于 码友网。
JavaScript eval(string) 函数
在上面的代码中,eval
是指执行 JavaScript 的 eval
函数,并且将后面的字符串数组作为它的参数传入。
在 JavaScript 中,eval(string)
函数可计算某个字符串,并执行其中的的 JavaScript 代码。在计算结束后,会返回一个字符串,就是参数中那个字符串执行完之后的返回值(如果有的话)。
于是意味着你可以通过这种方式拿到输入框中的值:
var userId = await WebView.InvokeScriptAsync("eval", new[]
{
"document.getElementById('userId').value;"
});
执行完后,可以得到 userId
的值是 walterlv
字符串;也就是我们上一步填充的那个值。
模拟用户登录
完整的输入用户名、密码,并点击登录按钮的代码则是这样的:
await LoginWebView.InvokeScriptAsync("eval", new[]
{
"document.getElementById('userId').value = 'walterlv';"
});
await LoginWebView.InvokeScriptAsync("eval", new[]
{
"document.getElementById('password').value = '不想让你看见的密码';"
});
await Task.Delay(1000);
await LoginWebView.InvokeScriptAsync("eval", new[]
{
"document.getElementById('submit').click();"
});
参考资料
我的博客会首发于 https://walterlv.com/,而 CSDN 和博客园仅从其中摘选发布,而且一旦发布了就不再更新。
如果在博客看到有任何不懂的内容,欢迎交流。我搭建了 dotnet 职业技术学院 欢迎大家加入。
本作品采用知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议进行许可。欢迎转载、使用、重新发布,但务必保留文章署名吕毅(包含链接:https://blog.csdn.net/wpwalter),不得用于商业目的,基于本文修改后的作品务必以相同的许可发布。如有任何疑问,请与我联系。