AspireWithJavaScript Docker compose not shown frontend

[timeshift92]

🔥 Bug Description

https://github.com/dotnet/aspire-samples/tree/main/samples/AspireWithJavaScript i'm clone this repo and generate docker compose in windows 10 after run dashboard i can't show react angular and vue containers

🔍 Steps to Reproduce the Bug

1. clone https://github.com/dotnet/aspire-samples/tree/main/samples/AspireWithJavaScript
2. generate output docker compose
3. run docker compose

🧯 Possible Solution

i don't know

[prom3theu5]

Hi There

This is due to the fact that we dont generate and inject https dev certs within the built containers. The nginx configs for each of the js apps all try to use the https port for proxy pass.

All you have to do is do a find and replace on proxy_pass ${services__weatherapi__https__0}; with proxy_pass ${services__weatherapi__http__0};

There should be three file changes - after that it'll run fine :)

After that - run aspirate generate / aspirate build again to rebuild all the containers

[timeshift92]

i was changed servicesweatherapihttps0 to servicesweatherapihttp0, but i wasn't saw react and other frontend services in aspire dashboard

[prom3theu5]

This is because the aspire manifest doesn't automatically add environmental variables for the containers for those resources unless you do it yourself

You'll have to open a bug on the aspire repo for this

Not to mention the web projects would also need to setup otlp and I dunno if the sample does

[timeshift92]

but if you run aspire without docke compose it's worked

[prom3theu5]

but if you run aspire without docke compose it's worked

Aye because that's handled directly by the dcp when aspire runs under debug mode for node apps. Not everything gets output to the manifest though when published, which is the problem.

They need to ensure that everything is written to the manifest with the extension method they currently use. Aspirate and other third party tools are completely driven by the manifest and if that doesn't contain the info then tools have no way to know

[timeshift92]

if I create issue in aspire, can You help me describe this problem?

[prom3theu5]

if I create issue in aspire, can You help me describe this problem?

Yeah sure

The problem is dockerfile resources don't emit environmental variables for OTLP connection to the manifest

You can see here: https://github.com/dotnet/aspire-samples/blob/main/samples/AspireWithJavaScript/AspireJavaScript.AppHost/aspire-manifest.json

The Project (ApiService) has env variables which tools read for OTLP

The docker files do not have these

[timeshift92]

oh. I can add this env in react manifest maybe it's helped for see aspire dashboard

[prom3theu5]

There are a couple of env vars to add You need one for service name too

https://learn.microsoft.com/en-us/dotnet/aspire/fundamentals/telemetry

[timeshift92]

it will be greate if you get me example =( , currently David Fowler tell me for not .net family service we need implement aspire otlp service