UIResponseWriter.WriteHealthCheckUIResponse and the UI about aspnetcore.diagnostics.healthchecks

[unaizorrilla]

Are you check the samples? UI is working well, we have a issue with exception serialization, and working on it!

[espenrl]

v2.2.2 / latest version of Chrome

variable A

A.filter

[CarlosLanderas]

Related issue: #16

[unaizorrilla]

Hi @espenrl

Can you try 2.2.2 version of the UI.Client and UI and check if the issue is solved?

[espenrl]

The same happens in latest version of Edge.

[unaizorrilla]

The sample project for UI works for you? Can you create a repro?

Other guys are using the UI without issues

[espenrl]

My bad. I had this setting pointing directly at the health endpoint. The confusing part was that it almost worked and I thought it was a polyfill issue (the json for the UI api endpoint and the health endpoint are almost the same). Thanks for the help!

AspNetCore.Diagnostics.HealthChecks/src/HealthChecks.UI/Configuration/Options.cs

Line 7 in 70cff8d

public string ApiPath { get; set; } = "/healthchecks-api";

[CarlosLanderas]

@espenrl thank you for the explanation. Exactly, the error .Filter of undefined is because the answer from the UI middleware returns a list and if you call directly to the health endpoint is an object. The UI should always call to the UI endpoint in order to work properly.

Thanks for the explanation. I Close the issue :)

[panna-ahmed]

@CarlosLanderas I have everything right but still getting this TypeError: A.filter is not a function error.
Here are my config:

app.UseHealthChecks("/health", new HealthCheckOptions()
{
Predicate = _ => true,
ResponseWriter = UIResponseWriter.WriteHealthCheckUIResponse
})
.UseHealthChecksUI(setup =>
{
setup.ApiPath = "/health";
setup.UIPath = "/health-ui";
});

"HealthChecksUI": { "HealthChecks": [ { "Name": "HTTP Basic", "Uri": "http://localhost:5000/health" } ], "Webhooks": [], "EvaluationTimeOnSeconds": 10, "MinimumSecondsBetweenFailureNotifications": 60 }

and the response coming from server is:
{"status":"Healthy","totalDuration":"00:00:00.0005566","entries":{"Database":{"data":{},"duration":"00:00:00.0005068","status":"Healthy"}}}

In the browser I am looking in http://localhost:5000/health-ui

[kafeltz]

@panna-ahmed same here... the server is returning a json the UI don't understand.

And taking a look at the source code AspNetCore.Diagnostics.HealthChecks\src\HealthChecks.UI\client\components\LivenessPage.tsx the input is really wrong. The ResponseWriter = UIResponseWriter.WriteHealthCheckUIResponse is not sending the correct json to the UI.

[CarlosLanderas]

@panna-ahmed please check the documentation, you are setting the UI API to the same path of the healthchecks endpoint. That's why the UI is not retrieving the correct data.

Change the UI API path do they don't collide.