locked
HybridWebView not work properly RRS feed

  • Question

  • User381680 posted

    Hey,

    I have a HybridWebView like the MS example.

    But my website is made with ASP Core, and I can't call C# Action from Javascript in my website.

    So I ask if someone as already done this. And something which is weird is I did reverse I implement call javascript from C# and it works so I don't understand very well.

    The code :

    My custom render :

    const string JavascriptFunction = "function invokeCSharpAction(data){jsBridge.invokeAction(data);}";
    if (Control == null)
                {
                    // Instantiate the native control and assign it to the Control property with
                    // the SetNativeControl method
    
                    var webView = new Android.Webkit.WebView(_context);
                    webView.Settings.JavaScriptEnabled = true;
    
                    // Implement WebViewClient who receive notification and request in JS with personalize function => JavascriptFunction
                    //webView.SetWebViewClient(new JavascriptWebViewClient($"javascript: {JavascriptFunction}"));
                    webView.SetWebViewClient(new JavascriptWebViewClient(JavascriptFunction));
                    webView.SetWebChromeClient(new JavascriptWebChromeClient());
    
                    SetNativeControl(webView);
                }
                if (e.OldElement != null)
                {
                    // Unsubscribe from event handlers and cleanup any resources
                    Control.RemoveJavascriptInterface("jsBridge");
                    var hybridWebView = e.OldElement as HybridWebView;
                    //var context = hybridWebView.BindingContext as ViewModelBase;
    
                    // Clean old action to execute in JS
                    //context.CleanAllActionInJS();
                    hybridWebView.Cleanup();
                }
                if (e.NewElement != null)
                {
                    // Configure the control and subscribe to event handlers
                    Control.AddJavascriptInterface(new JSBridge(this), "jsBridge");
                    var view = e.NewElement as HybridWebView;
    
                    //Control.LoadUrl($"file:///android_asset/Content/{Element.Url}");
                    // Add Url to hybridWebview
                    Control.LoadUrl(Element.Url);
                }
    
    
        public class JavascriptWebViewClient : WebViewClient
            {
                private string _javascript;
    
                public JavascriptWebViewClient(string javascript)
                {
                    _javascript = javascript;
                }
    
                /// <summary>
                /// When page is charged, execute JS
                /// </summary>
                /// <param name="view"></param>
                /// <param name="url"></param>
                public override void OnPageFinished(WebView view, string url)
                {
                    base.OnPageFinished(view, url);
                    view.EvaluateJavascript(_javascript, null);
    
                }
        }
    
    
     public class JSBridge : Java.Lang.Object
        {
            readonly WeakReference<HybridWebViewRenderer> hybridWebViewRenderer;
    
            public JSBridge (HybridWebViewRenderer hybridRenderer)
            {
                hybridWebViewRenderer = new WeakReference <HybridWebViewRenderer> (hybridRenderer);
            }
    
            [JavascriptInterface]
            [Export ("invokeAction")]
            public void InvokeAction (string data)
            {
                HybridWebViewRenderer hybridRenderer;
    
                if (hybridWebViewRenderer != null && hybridWebViewRenderer.TryGetTarget (out hybridRenderer))
                {
                    //var context = hybridRenderer.Element.BindingContext as ViewModelBase;
    
                    // Depending if pass or not data
                    if (!string.IsNullOrEmpty(data)) hybridRenderer.Element.InvokeAction(data);
                    else hybridRenderer.Element.InvokeAction();
                }
            }
    }
    

    So when I use this in my website the way I think is to do : invokeCSharpAction(mydata) in a JS function.

    Thanks

    Thursday, May 9, 2019 9:49 AM

All replies

  • User369978 posted

    Your code looks no problem , It should be able to invoke c# form Javascript :https://docs.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/custom-renderer/hybridwebview#invoking-c-from-javascript

    What do you mean by I did reverse I implement call javascript from C# ?

    Thursday, May 9, 2019 1:47 PM
  • User381680 posted

    @ColeX Hey, I mean I would invoke C# from Javascript that don't work, but I implement reverse so I can call JS from C#. I implement the tuto of Xamarin Help for that : https://xamarinhelp.com/xamarin-forms-webview-executing-javascript/

    Friday, May 10, 2019 6:04 AM
  • User369978 posted

    Have you ever tried this sample :https://developer.xamarin.com/samples/xamarin-forms/customrenderers/hybridwebview/ ?

    Monday, May 13, 2019 9:22 AM
  • User381680 posted

    @ColeX Yes I already say in my first message.

    Tuesday, May 14, 2019 5:43 AM
  • User369978 posted

    I test MS sample on my side , it works perfect.

    Could you provide your html file to me for testing ?

    Tuesday, May 14, 2019 7:34 AM
  • User381680 posted

    @ColeX I can't but my html file in okay, I think it's because there is a issue when the JS is injected into html page, that the page isn't in local, it's is hosted with the website in ASP Core. I have try to call with button inline and in the Javascript and no ways works. Also when I call the JS event from C# it's working. So I am don't know what to do.

    Tuesday, May 14, 2019 8:42 AM
  • User369978 posted

    Do you mean that the remote website display well in HybridWebView , however it did not call c# method when you click button in it ?

    okay, the client code looks no problem , i think you should double check your web side , etc, whether the button could trigger the function correctly , whether the method name inside click event match to c# method .

    Thursday, May 16, 2019 7:56 AM
  • User381680 posted

    @ColeX yes, exacly, you've right that what I think too, however I think the trigger is ok, I try to do in JS file but as the "function invokeCSharpAction(data){jsBridge.invokeAction(data);}"; is inject when the page is loaded it show error its' normal. But When i try directly on the button with "inline:invokeCSharpAction("dataTest"), that's not work.

    I try to find a way to get the context of JS to see if the JS injection is well done.

    Thursday, May 16, 2019 8:42 AM
  • User275676 posted

    https://github.com/SKLn-Rad/Xam.Plugin.Webview

    Thursday, May 16, 2019 4:39 PM
  • User381680 posted

    Ok so my issue it's patched it came from my website in ASP Core.

    Friday, May 17, 2019 1:27 PM
  • User95099 posted

    Hi there, I ran into the same problem, Xamarin.Android came up with an update and the [JavascriptInterface] is Obsolete now! Check Xamarin.Android documentation even I tried the sample code as its and it didn't work either

    the documentation suggests to use IJavascriptInterface instead, but to be honest I am stuck at this point because I couldn't find enough examples and resources on how to implement this interface properly

    Any Ideas?

    Thursday, November 7, 2019 12:36 AM