Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add sample that send telemetry from the browser #409

Open
JamesNK opened this issue Aug 14, 2024 · 7 comments
Open

Add sample that send telemetry from the browser #409

JamesNK opened this issue Aug 14, 2024 · 7 comments
Assignees

Comments

@JamesNK
Copy link
Member

JamesNK commented Aug 14, 2024

See https://github.com/dotnet/aspire/tree/main/playground/BrowserTelemetry as an example of how to do this.

@JamesNK JamesNK changed the title Send telemetry from the browser in AspireWithNode sample Add sample that send telemetry from the browser Aug 14, 2024
@DamianEdwards
Copy link
Member

I'm thinking we should just update the existing AspireWithJavaScript sample to do this. It has Angular, React, and Vue apps in it so seems like a good candidate to add this functionality.

/Cc @IEvangelist

@IEvangelist
Copy link
Member

I'm thinking we should just update the existing AspireWithJavaScript sample to do this. It has Angular, React, and Vue apps in it so seems like a good candidate to add this functionality.

/Cc @IEvangelist

Tried doing this, only to learn that it's not really well supported. I spoke with @vhvb1989 and @davidfowl on this, and here's the conclusion as to why we cannot do this with the AspireWithJavaScript sample:

  • Since these apps are SPAs, they're built in the container and their bits are pushed to a /dist folder and served by nginx as static files.

  • In order to get the values of the OTEL_EXPORTER_OTLP_ENDPOINT, OTEL_EXPORTER_OTLP_HEADERS, and OTEL_RESOURCE_ATTRIBUTES at deployment time, I attempted to use the PublishAsDockerFile with the following build args:

    DockerBuildArg[] otelBuildArgs = [
        new("OTEL_EXPORTER_OTLP_ENDPOINT"),
        new("OTEL_EXPORTER_OTLP_HEADERS"),
        new("OTEL_RESOURCE_ATTRIBUTES")
    ];

    However, these env vars are not available during build when publishing the app.

  • At runtime, these env var values are available, but at that point - it's too late.

  • Also, ACA doesn't expose the OTEL collector.

@DamianEdwards
Copy link
Member

@IEvangelist everything you're referring to is regarding supporting this after publishing to ACA, correct? IIUC we could make the sample support it at dev time without much trouble but it wouldn't work after publishing, right?

@IEvangelist
Copy link
Member

IEvangelist commented Nov 14, 2024

@IEvangelist everything you're referring to is regarding supporting this after publishing to ACA, correct? IIUC we could make the sample support it at dev time without much trouble but it wouldn't work after publishing, right?

@DamianEdwards - Correct, I have it working locally for dev time support...that was still a bit of work though. So many different opinions about how each JS SPA framework handles building env vars.

@DamianEdwards
Copy link
Member

OK. I guess we just need to decide if we want to include it in the sample in that state then, perhaps with a note in the README. Given how many folks asked for the feature and the fact we made changes to unblock it, seems like it's worthwhile?

@IEvangelist
Copy link
Member

Yeah, again I have this all working locally and correctly reporting browser telemetry for each SPA. I could add a note in the README.md to say something about the deployment not working. Perhaps, we should remove the Dockerfiles from the sample then too, as it's really confusing to include them since they will not work.

@DamianEdwards
Copy link
Member

Could we update the sample logic so that the client app gets the URL via a call to a backend API?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants