Ajax XHR

IPC with WebView2 using Ajax XHR is done with the standard Ajax XHR or any wrapper/implementer of XHR syntax like jQuery.ajax(), fetch, axios or another XHR wrapper/implementer.

To setup for Ajax/XHR for a request "htttp://edgesharp.com/helloworld" will require:

Scheme: http
Host: edgesharp.com
Route Path: /helloworld

1. Create & Register ActionController
2. Register Url Scheme
3. Make The Request

Create & Register ActionController

Every request is mapped to an Action (method) defined in an ActionController class. A sample action will be (HelloWorld):

[ActionController(Name = "HelloWorldActionController", Description = "HelloWorld controller")]
public class HelloWorldActionController : ActionController
{
	[ActionRoute(Path = "/helloworld")]
	public string HelloWorld()
	{
		return "Hello, World!";
	}
}

Next, the ActionController class "HelloWorldActionController" will be registered in the Application 'ConfigureServices" method either by registering the ActionController itself or the Assembly that contains the controller.

Registering the ActionController:

public class HelloWorldApp : EdgeSharpApp
{
	public override void ConfigureServices(IServiceCollection services)
	{
		base.ConfigureServices(services);
		// other service configuration can be placed here
		
		services.AddSingleton<ActionController, HelloWorldActionController>();
	}
}

Registering the ActionController assembly:

public class HelloWorldApp : EdgeSharpApp
{
	public override void ConfigureServices(IServiceCollection services)
	{
		base.ConfigureServices(services);
		// other service configuration can be placed here

		RegisterActionControllerAssembly(services, typeof(HelloWorldActionController).Assembly);
	}
}

Register Url Scheme

Developers can either use the default url scheme - "http://edgesharp.com" or register a new one. If default is preferred, nothing needs to be done, all requests must just start with : "http://edgesharp.com" with request path appended e.g /helloworld.

To register a Ajax/XHR route to action Scheme, it requires

• Scheme - e.g http, https
• Host - e.g edgesharp.com, myhost.com - these are arbitrary/fake hostnames that are not expected to be real hostnames.
• Folder - null. It is redundant - unused
• Scheme type - RouteToAction. Other scheme types can be found at: UrlSchemeType.

Following will use:

Scheme	Host	Folder	Scheme Type
http	myhost.com	null	RouteToAction

var config = new Configuration();
var actionScheme = new UrlScheme("http", "myhost.com", null, UrlSchemeType.RouteToAction);;
config.UrlSchemes.Add(actionScheme);

Make The Request

Using the default scheme ("http", "edgesharp.com") to call the action HelloWorld in HelloWorldActionController above.

axios.get('http://edgesharp.com/helloworld')
.then(response => {
if (response.status == 200) {
   // response.data : "Hello, World!";
}
else {
	console.log(response);
}
})
.catch(error => {
	console.log(error)
});

Axios is used here as an example, but any Ajax/XHR library can be used.

See usage in Win3, WinForms, Wpf.