How to talk to an asp.net core mvc app in Xamarin.Forms hybrid WebView

Question

Hi,

I have been reading and running samples on Xamarin forms custom WebView and executing JavaScript methods like a bridge from different sources:

https://theconfuzedsourcecode.wordpress.com/2020/02/02/pushing-the-limits-of-hybrid-webview-in-xamarin-forms/
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/custom-renderer/hybridwebview

My scenario:

We developed an asp.net core site and it is on our server. We would like to wrap it in a Xamarin Forms App and talk to it to send extra information. It will make it easier to maintain for my client.

I came across bridge js. The custom WebView could render the asp.net mvc site from the server and maybe talk to the Xamarin web view control to get extra functionality from Xamarin essentials.

For example, I have got a razor view which I would like it to get the geolocation from Xamarin. Is there a way the ASP.net mvc client can detect whether it is loaded on the Xamarin browser or not? We would like the website to still work when running on a traditional internet browser.

Ideally, what I would like to know is what's the way I can run the website inside Xamarin, detect that has been called from the Xamarin project and then when a user click on a button on that razor view intercept it and get the geolocation from the Xamarin app.

Hope it makes sense.

Thanks.

Answer 1

Hello,​

Welcome to our Microsoft Q&A platform!

when a user click on a button on that razor view intercept it and get the geolocation from the Xamarin app.

You can execute JS, then call the get location function for android or iOS. For example, I have html page set the webview(I cannot post html code in this forum).

Then I achieve custom renderer for webview.

   using System;  
   using System.Collections.Generic;  
   using System.ComponentModel;  
   using System.Linq;  
   using System.Text;  
     
   using Android.App;  
   using Android.Content;  
   using Android.OS;  
   using Android.Runtime;  
   using Android.Views;  
   using Android.Webkit;  
   using Android.Widget;  
   using Java.Interop;  
   using WebviewInvokeJS;  
   using WebviewInvokeJS.Droid;  
   using Xamarin.Forms;  
   using Xamarin.Forms.Platform.Android;  
     
   [assembly: ExportRenderer(typeof(HybridWebView), typeof(HybridWebViewRenderer))]  
   namespace WebviewInvokeJS.Droid  
   {  
     
       public class HybridWebViewRenderer : WebViewRenderer  
       {  
           Context _context;  
           public HybridWebViewRenderer(Context context) : base(context)  
           {  
               _context = context;  
           }  
           protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)  
           {  
     
               if (Control != null)  
               {  
                   Control.Settings.JavaScriptEnabled = true;  
                   Control.AddJavascriptInterface(new HybridJSBridge(Android.App.Application.Context), "CSharp");  
                   Control.SetWebViewClient(new WebViewClient());  
               }  
     
               base.OnElementPropertyChanged(sender, e);  
           }  
       }  
     
       
   }  

Then click button in html, execute JS to get the location data.

   using System;  
   using System.Collections.Generic;  
   using System.Linq;  
   using System.Text;  
     
   using Android.App;  
   using Android.Content;  
   using Android.OS;  
   using Android.Runtime;  
   using Android.Views;  
   using Android.Webkit;  
   using Android.Widget;  
   using Java.Interop;  
   using Xamarin.Essentials;  
     
   namespace WebviewInvokeJS.Droid  
   {  
       public class HybridJSBridge : Java.Lang.Object  
       {  
           Context context;  
     
           public HybridJSBridge(Context context)  
           {  
               this.context = context;  
           }  
     
           [JavascriptInterface]  
           [Export]  
           public async void ShowToast(string msg)  
           {  
               var location = await Geolocation.GetLastKnownLocationAsync();  
     
               if (location != null)  
               {  
                   Console.WriteLine($"Latitude: {location.Latitude}, Longitude: {location.Longitude}, Altitude: {location.Altitude}");  
               }  
     
               Toast.MakeText(context, msg, ToastLength.Short).Show();  
           }  
     
       }  
   }  

Is there a way the ASP.net mvc client can detect whether it is loaded on the Xamarin browser

Xamarin do not have this function, you can open a new thread in Asp.net forum add Asp.net tag.

For example

Best Regards,

Leon Lu

---

If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.