Integrate Glimpse in ASP.NET Core

Introduction

Glimpse is a diagnostic platform for the web based application. It provides real time diagnostics and insights of the application. So it helps a developer to have a better understanding of what is occurring inside the application, i.e., get the insights about each request cycle, the time taken for each request to get processed and other deep insights like that.

Background

Glimpse inspects web requests as they happen, providing insights and tooling that reduce debugging time and helps every developer to improve their web applications by analyzing the insights as it also display the trace statements.

Integrating Glimpse into Solution

Integrating Glimpse into ASP.NET 5 solution is quite easy, though some of the precautions need to be taken care of. I will be mentioning that below while adding the steps to add glimpse.

Step 1

Open the project.json file and add the reference to Glimpse under the dependencies section as below:

{
  "webroot": "wwwroot",
  "version": "1.0.0",
  "dependencies": {
    "Glimpse": {
      "version": "2.0.0-beta1",
      "target": "package"
    }
  },

  "frameworks": {
    "dnx46": {
    }
  },

  "exclude": [
    "wwwroot",
    "node_modules",
    "bower_components"
  ],
  "publishExclude": [
    "node_modules",
    "bower_components",
    "**.xproj",
    "**.user",
    "**.vspscc"
  ],

 "configurations": {
    "Debug": {
      "compilationOptions": {
        "define": [
          "DEBUG",
          "TRACE",
          "CODE_ANALYSIS"
        ],
        "optimize": false,
        "warningsAsErrors": false,
        "allowUnsafe": false
      }
    },
    "Release": {
      "compilationOptions": {
        "define": [
          "RELEASE",
          "TRACE",
          "CODE_ANALYSIS"
        ],
        "optimize": true,
        "warningsAsErrors": false,
        "allowUnsafe": false
      }
    }
  }
}

Step 2

After adding the reference to Glimpse in the project json, configure it using the Startup class of the project.

public class Startup
{
     private IHostingEnvironment HostingEnvironment { get; set; }
     
     public Startup(IHostingEnvironment hostingEnvironment)
     {
         this.HostingEnvironment = hostingEnvironment;
     }
      
     public void ConfigureServices(IServiceCollection services)
     {
        if (this.HostingEnvironment.IsDevelopment())
        {
            services.AddGlimpse();
        }
     }
      
     public void Configure(IApplicationBuilder applicationBuilder, ILoggerFactory loggerFactory)
     {
        if (this.HostingEnvironment.IsDevelopment())
        {
            applicationBuilder.UseGlimpse();
        }
     }
}

Explanation of the Code

So, in the above code, we need to identify the hosting environment of the application first. We do it in the constructor of the Startup class.

Later then, in the ConfigureServices method of the Startup class based on the hosting environment and if it is development environment, we add the glimpse to the services collections using services.AddGlimpse().

In the last step, inside the Configure method of the Startup class, we register Glimpse into the pipeline of the application using applicationBuilder.UseGlimpse().

Now finally, glimpse is integrated into the application, Run the solution and Glimpse dashboard will appear at the bottom of the screen like below:

Points of Interest

There are few concerns around integrating glimpse to the application that I noticed while adding glimpse to my sample application. If you add glimpse into the services collection, then make sure you use it in the configure method, otherwise glimpse throws out an exception. Also, since glimpse is a web debugging and diagnostic tool which gives application insights on the browser windows, hence it should always be added for development environment only.

This article is based on the beta version of the Glimpse package, hence actual implementation may vary later.

Have a happy time integrating Glimpse into your application. :)