在WebView和主机应用程序之间传递数据 [英] Passing data between WebView and host application

问题描述

我正在开始开发连接到Web项目的移动应用程序，该程序可以让患者记录出血情况.在网络上，用户可以单击并选择一些人物上的特定位置.带有一些选择的一个像这样

I'm starting development of mobile application connected to web project that let's patients take notes of their bleedings. On web the user can click and select certain places on few human figures. One with some selection looks like this

我真的不认为使用标准控件(?)可以很容易地做到这一点，所以我认为使用WebView承载处理选择的代码段是最简单的.

I don't really think this would be easy to achieve using standard controls(?), so I thought it would be the easiest to use a WebView that would host the piece of code that handles selection.

要设置位置，例如当用户想要编辑旧的出血时，我可以按照Xamarin指南了解如何从C#调用JS，但是返回值是空的.我一直找不到能够从Xamarin.Forms.WebView获取数据的方法.有什么建议吗?

To set the locations e.g when user wants to edit old bleeding I could just follow Xamarin guide on how to call JS from C#, however, the return value is void. I haven't been able to find a way how to get data from Xamarin.Forms.WebView. Any suggestions?

推荐答案

这在很大程度上取决于您要定位的平台和平台版本.

This highly depends on what platforms and version of platforms your are trying to target.

如果您真的想使用WebView，则可以查看 XLabs Hybrid WebView ，它的功能与我所相信的相似.

If you really want to use a WebView, you might check out the XLabs Hybrid WebView which does something similar I believe.

除了XLabs的方法外，您还可以轻松地使用UIWebView.EvaluateJavascript()方法从iOS渲染器中获取字符串，然后始终可以在Xamarin Android WebView渲染器中覆盖WebChromClient.OnJsAlert(

Other than XLabs' methods, you can easily get back a string from an iOS renderer using the UIWebView.EvaluateJavascript() method and then you can always override WebChromClient.OnJsAlert in a Xamarin Android WebView renderer (link), which I have successfully used back to Android 4.1.

类似的东西(让我知道是否某些功能不起作用或丢失，我将其打出并删除了多余的代码，因此可能存在一些小问题)...

Something like (Let me know if something does not work or is missing, I typed this out and removed extra code so there may be minor issues)...

Xamarin表单代码:

Xamarin Forms Code:

public class SomethingWebView : WebView { }

具有UIWebViewDelegate的iOS WebView Renderer:

iOS WebView Renderer with UIWebViewDelegate:

[assembly: Xamarin.Forms.ExportRenderer(typeof(SomethingWebView), typeof(Your.Droid.Namespace.SomethingWebViewRenderer))]

namespace Your.Droid.Namespace.Renderer {

public class SomethingWebViewRenderer : WebViewRenderer {

    protected override void OnElementChanged(VisualElementChangedEventArgs e) {
        base.OnElementChanged(e);

        if(e.OldElement == null) {
            Delegate = new SomethingWebViewDelegate();
        }
    }
}

internal class SomethingWebViewDelegate : UIWebViewDelegate {

    public override void LoadingFinished(UIWebView webView) {
        string something = webView.EvaluateJavascript("(function() { return 'something'; })()");
    }
}
}

具有WebViewClient和WebChromeClient的Android WebView Renderer:

Android WebView Renderer with WebViewClient and WebChromeClient:

[assembly: Xamarin.Forms.ExportRenderer(typeof(SomethingWebView), typeof(Your.iOS.Namespace.SomethingWebViewRenderer))]

namespace Your.iOS.Namespace.Renderer {

public class SomethingWebViewRenderer : WebViewRenderer {

    protected override void OnElementChanged(ElementChangedEventArgs<WebView> e) {

        base.OnElementChanged(e);

        if(e.OldElement == null) {

            Control.Settings.JavaScriptEnabled = true;

            Control.SetWebViewClient(new SomethingWebViewClient());

            Control.SetWebChromeClient(new SomethingWebChromeClient());
        }
    }
}

internal class SomethingWebViewClient : WebViewClient {

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

        view.LoadUrl("javascript:{(function() { window.alert('something'); })()};");
    }
}

public class SomethingWebChromeClient : WebChromeClient {

    public override bool OnJsAlert(Android.Webkit.WebView view, string url, string message, JsResult result) {

        if(message.StartsWith("something") { //This is where you would look for your magic string, anything starting with your magic string is what you would extract and/or act on
            //Do something....

            result.Cancel(); //This cancels the JS alert (there are other talked about methods of doing this but this works for me)
            return true; //This tells the WebView "we got this"
        }

        return base.OnJsAlert(view, url, message, result); //Let the WebView handle this since we did not find out special string
    }
}
}

最后，我研究过的另一种方法涉及使用JavaScript将页面重定向到新的URL，然后在用于告诉WebView是否应继续进行重定向的事件中，拉出WebView的当前位置. URL，如果找到了魔术字符串，则可以执行某些操作.除了URL只能长255个字符这样不能满足我的需要外，这本来会很好用的.

Finally, another method I looked at involved using JavaScript to redirect the page to a new URL, then in the event that is used to tell the WebView whether or not it should go forward with the redirect, you pull out the WebView's current URL and, if you find your magic string, you do something. This would have worked great except for the fact that URLs can only be like 255 characters long so it would not work for my needs.

这篇关于在WebView和主机应用程序之间传递数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！