Browser detection in ASP.NET core

.NET framework 4.7 has a Browser property on HttpContext.Request which gives you information about the browser, from where the HTTP request came from. Unfortunately, ASP.NET core does not have this feature and the ASP.NET team decided to not port it.

Here is the response from the team.

Hi, the browser caps feature in ASP NET 4.x was a server-based way of doing client feature detection. This approach is generally frowned upon in the “modern” era, where runtime client-side feature detection is preferred, using techniques such as progressive enhancement. For that reason, in addition to being a huge maintenance cost to keep the list even reasonably up-to-date, the feature was not brought forward to ASP NET Core.

While I agree with the above response, IMHO, There are certain use cases where browser detection needs to be done on server side. A good example is a proxy server acting as a gateway for requests coming to your web server. Based on the browser, the gateway can route the traffic to different versions of your app/servers (think about an A/B testing infrastructure, targeting a user base from a specific browser / browser version).

I ended up writing a light weight browser detection library.

This library adds the following capabilities to your asp net core app

1. Browser detection
2. Device type detection
3. Operating system detection

How to use ?

Step 1: Install the BrowserDetector nuget package

Install-Package Shyjus.BrowserDetector

Step 2: Enable the browser detection service inside the ConfigureServices method of Startup.cs.

public void ConfigureServices(IServiceCollection services)
{
    // Add browser detection service
    services.AddBrowserDetection();

    services.AddMvc();
}

Step 3: Inject IBrowserDetector to your controller class or view file or middleware and access the Browser property. The property is lazy loaded.

Example usage in controller code

public class HomeController : Controller
{
    private readonly IBrowserDetector browserDetector;
    public HomeController(IBrowserDetector browserDetector)
    {
        this.browserDetector = browserDetector;
    }
    public IActionResult Index()
    {
        var browser = this.browserDetector.Browser;
        // Use browser object as needed.

        return View();
    }
}

Example usage in view code

@inject Shyjus.BrowserDetector.IBrowserDetector browserDetector

<h2> @browserDetector.Browser.Name </h2>
<h3> @browserDetector.Browser.Version </h3>
<h3> @browserDetector.Browser.OS </h3>
<h3> @browserDetector.Browser.DeviceType </h3>

Example usage in custom middlware

You can inject the IBrowserDetector to the InvokeAsync method.

public class MyCustomMiddleware
{
    private RequestDelegate next;

    public MyCustomMiddleware(RequestDelegate next)
    {
        this.next = next;
    }

    public async Task InvokeAsync(HttpContext httpContext,
                                  IBrowserDetector detector)
    {
        var browser = detector.Browser;

        if (browser.Name == BrowserNames.Edge)
        {
            await httpContext.Response
                  .WriteAsync("Have you tried the new chromuim based edge ?");
        }
        else
        {
            await this.next.Invoke(httpContext);
        }
    }
}

Help this project ?

You can further help the project by visiting http://bit.ly/detectbrowser in your browser and see the detection works. File an issue if you see wrong data.

Cheers