从Xamarin.Forms中用javascript传递一些文本到WebView中。

Question

我试图从xamarin.forms发送一些文本到一个webView控件中。有很多解决方案，我几乎都试过了... ;-)

所以实际上他们工作得很好，但我总是要点击html文件上的一个按钮，我把它加载到这个webView中，这样我就可以把一些文本传递到html文件中。但我想在不点击这个按钮的情况下传递文本。当webView加载完毕后，文本应该在那里。

下面是一些代码。

在xaml. cs中我加载了WebView:

  protected override void OnAppearing()
    {
        base.OnAppearing();

        webViewElement.Source = new HtmlWebViewSource();
        webViewElement.Source = DependencyService.Get<IBaseUrl>().Get();

        webViewElement.RegisterAction(ExecuteActionFromJavascript);

        ExecuteSetFromJavascript();
    }

然后用ExecuteSetFromJavascript()调用html文件中的一个函数。

  private async void ExecuteSetFromJavascript()
    {
        var result = "Hello";
        if (result != null)
        {
          var test =  await webViewElement.EvaluateJavaScriptAsync($"updatetextonwebview('{result}')");
        }
    }

这就是html文件中的函数。

  function updatetextonwebview(text) {

                                alert(text);

                                   // document.getElementById("content").innerHTML = text;
                                }

所以现在当updatetextonwebview被调用时，页面应该会发出 "你好 "的提示。

但这并不能使它。也许当我调用这个函数时，html页面还没有准备好!

有谁知道我如何能得到我的解决方案？

先谢谢你...

Answer 1

我现在的解决方案是：在HybridWebView中，我添加了一个属性。

using System;
using Xamarin.Forms;

namespace CustomRenderer

{
    public class HybridWebView : WebView
    {
        Action<string> action;

        public static readonly BindableProperty UriProperty = BindableProperty.Create(
            propertyName: "Uri",
            returnType: typeof(string),
            declaringType: typeof(HybridWebView),
            defaultValue: default(string));

        public static BindableProperty QuestionProperty = BindableProperty.Create(
            propertyName: "Question",
            returnType: typeof(string),
            declaringType: typeof(HybridWebView),
            defaultValue: default(string));

        public static BindableProperty AnswerProperty = BindableProperty.Create(
            propertyName: "Answer",
            returnType: typeof(string),
            declaringType: typeof(HybridWebView),
            defaultValue: default(string));

        public string Uri
        {
            get { return (string)GetValue(UriProperty); }
            set { SetValue(UriProperty, value); }
        }

        public string Question
        {
            get { return (string)GetValue(QuestionProperty); }
            set { SetValue(QuestionProperty, value); }
        }

        public string Answer
        {
            get { return (string)GetValue(AnswerProperty); }
            set { SetValue(AnswerProperty, value); }
        }

        public void RegisterAction(Action<string> callback)
        {
            action = callback;
        }

        public void Cleanup()
        {
            action = null;
        }

        public void InvokeAction(string data)
        {
            if (action == null || data == null)
            {
                return;
            }
            action.Invoke(data);
        }
    }
}

我可以在JavaScriptWebViewClient中访问，在OnPageFinished时，我可以将数据提交给WebPage。

  public class JavascriptWebViewClient : FormsWebViewClient
{
    string _javascript;
    string _question;
    private string _answer;

    public JavascriptWebViewClient(HybridWebViewRenderer renderer, string javascript, string question, string answer) : base(renderer)
    {
        _javascript = javascript;
        _answer = answer;
        _question = question;
    }

    public override void OnPageFinished(WebView view, string url)
    {
        base.OnPageFinished(view, url);


        view.EvaluateJavascript($"factorial({_question}, {_answer})", null);

        view.EvaluateJavascript(_javascript, null);
    }
}

Answer 2

你想要的是被称为 混合WebView. 这意味着它既可以接收数据，也可以发送数据。

我看到你提供的代码有很多不一致的地方和问题--为什么要在OnAppearing中配置WebView，为什么源码要设置两次等等。

既然提供的代码不够用，而且充满了问题和疑问--与其试图找出确实出错的地方，不如按照官方的指南来创建一个 混合WebView 来自微软- 自定义WebView.

这是工作的，你也有最终的解决方案在GitHub中可用的 此处.

如果你还有什么问题，欢迎提问，不过我觉得指南很直接。