apm server behind reverse proxy: apm-agent-rum-js can't send data

[TimB87]

Hi everybody,

I am trying to include this agent to collect RUM data on a service I manage.
The apm server is behind a reverse proxy (caddy) that adds ssl to it.

This is in my services index.php:

  <script src="elastic-apm-rum.umd.min.js" crossorigin></script>
  <script>
    elasticApm.init({
      serviceName: 'my_service',
      environment: 'production',
      serverUrl: 'https://apm-server:8201',
      logLevel: 'trace',
      sendCredentials: 'true',
    })
  </script>

However, my browsers dev console reports:

elastic-apm-rum.umd.min.js:1 
        
        
       POST https://apm-server:8201/intake/v2/rum/events 401 (Unauthorized)

With curl, from my services host, I can verify it working:

$ curl --request GET --insecure --url https://apm-server:8201 --header 'Authorization: Bearer redacted'
{
  "build_date": "2024-04-23T20:43:30Z",
  "build_sha": "8ae8346c18a8cb50c418de461857a1f1af1d1a6a",
  "publish_ready": true,
  "version": "8.13.3"
}

I am unable to supply my secretToken, as elastic-apm-rum.umd.min.js seems to ignore it.
Am I missing something obvious?

Thanks for your assistance!
Best regards,
Tim

PS: The service is also hooked up to APM with the php agent, which works great. This elastic cluster is run locally via docker.

[vigneshshanmugam]

@TimB87 Thanks for using the RUM agent.

SecretToken is not supported for the RUM agent as there is no way to prevent them from being exposed.

Please find the relevant APM server docs on how to enable for anonymous authentication for RUM agent - https://www.elastic.co/guide/en/observability/current/apm-anonymous-auth.html#apm-anonymous-auth

[TimB87]

@vigneshshanmugam Thanks! That hopefully pointed me on the right path.
For some reason, I am unable to pass anonymous authorization with rum-js and Caddy. However, what works and seems to not share my token is the following Caddy directive:

https://apm-server:8201 {
        reverse_proxy http://apm-server:8200 {
                header_down Access-Control-Allow-Origin https://my-frontend
                header_down Access-Control-Allow-Credentials true
                header_down Access-Control-Request-Method POST,OPTIONS

                header_up Authorization "Bearer redacted"
        }
        tls /data/cert.crt /data/cert.key {
                ca_root /data/rootchain.crt
        }
}

I am not exactly an webdev myself - would you consider that configuration safe?

Unfortunately, it seems that I have to define my allowed origin specifically, as a wildcard is rejected again by cors.