等效于WebView2中的WebBrowser.InvokeScript(String，Object []) [英] Equivalent of WebBrowser.InvokeScript(String, Object[]) in WebView2

问题描述

预先感谢.

在我的WPF应用程序中，我能够使用WebBrowser的InvokeScript(String，Object [])方法成功地将消息从WPF传递到JavaScript.我在Object []参数中传递消息，并且JS代码很好地收到了它.(请参见下面的代码)

In my WPF application, I am successfully able to communicate a message from WPF to JavaScript using the InvokeScript(String, Object[]) method of WebBrowser. I am passing my message in Object[] parameter and it is well recieved by JS code. (See the code below)

我如何在WebView2中实现相同的目的，就像在WebBrowser控件中一样，有什么方法可以将参数传递给JS代码吗?

How can i achieve the same thing in WebView2, Is there any way we can pass on the parameters to the JS Code just like we do in WebBrowser control ?

Window.xaml

Window.xaml

 <Grid>
            <DockPanel> 
                <StackPanel>        
                <TextBox x:Name="txtMessageFromWPF" Width="150" FontSize="20"></TextBox>
                <Button x:Name="btnCallDocument" Click="btnCallDocument_Click" Content="CallDocument" />
                </StackPanel>
                <WebBrowser x:Name="webBrowser" DockPanel.Dock="Top" Margin="30"/>           
            </DockPanel>
        </Grid>

Window.xaml.cs

Window.xaml.cs

        private void btnCallDocument_Click(object sender, RoutedEventArgs e)
        {
            webBrowser.InvokeScript("WriteMessageFromWPF", new object[] { this.txtMessageFromWPF.Text });
        }

JS代码:

 <script type="text/javascript">
            function getAlert()
            {
                alert("Hi the page is loaded!!!");
            }
            window.onload = getAlert;
            
            function WriteMessageFromWPF(message){
                document.write("Message from WPF: " + message);
            }
        </script>

推荐答案

更新:该扩展程序的版本2更简单，更通用.它使用JSON作为中间站"-使用NewtonSoft或内置的JSON转换器.

Update: Version 2 of the extension is much simpler and more universal. It uses JSON as 'middle-station'- use NewtonSoft or the built-in JSON converter.

这是我做的扩展名(只需创建一个类文件并将其粘贴).

Here's an extension I have made (just create a class file and paste it).

ExecuteScriptFunctionAsync 构建 ExecuteScriptAsync 所需的字符串，然后执行它:

The ExecuteScriptFunctionAsync builds the string necessary for ExecuteScriptAsync and then executes it:

//using Microsoft.Web.WebView2.WinForms; //Uncomment the one you use
//using Microsoft.Web.WebView2.Wpf; //Uncomment the one you use
using Newtonsoft.Json;
using System.Threading.Tasks;

public static class Extensions
{
    public static async Task<string> ExecuteScriptFunctionAsync(this WebView2 webView2, string functionName, params object[] parameters)
    {
        string script = functionName + "(";
        for (int i = 0; i < parameters.Length; i++)
        {
            script += JsonConvert.SerializeObject(parameters[i]);
            if (i < parameters.Length - 1)
            {
                script += ", ";
            }
        }
        script += ");";
        return await webView2.ExecuteScriptAsync(script);
    }
}

将javascript函数名称作为第一个参数，然后是函数参数.

Pass the javascript function name as first parameter, followed by the function parameters.

该代码使得可以具有可转换为JSON的各种类型的任意数量的参数: object ， array ， string ，所有数字，布尔值等

The code makes it possible to have any number of parameters of all types that can be srialized to JSON: object, array, string, all numbers, boolean etc.

使用示例(来自问题):

private async void btnCallDocument_Click(object sender, RoutedEventArgs e)
{
    await webBrowser.ExecuteScriptFunctionAsync("WriteMessageFromWPF", this.txtMessageFromWPF.Text);
}

另一个示例(这会将窗口滚动到底部):

Another example (this will scroll the window to bottom):

await webView21.ExecuteScriptFunctionAsync("window.scrollTo", 0, 10000);

这篇关于等效于WebView2中的WebBrowser.InvokeScript(String，Object [])的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！