Elastic APM Angular Package Returns 400 with Angular 9

Elastic Observability APM
3

Hello @Hamidreza. I fixed it by installing APM server with Docker alongside the other services and making the call to that instead of Elastic directly. The errors are appearing correctly now. Thanks.

In the docker-compose.yml file:

  apm-server:
    image: docker.elastic.co/apm/apm-server:7.6.2
    container_name: apm-server
    command: >
      apm-server -e
        -E apm-server.rum.enabled=true
        -E apm-server.rum.event_rate.limit=300
        -E apm-server.rum.event_rate.lru_size=1000
        -E apm-server.rum.allow_origins=['*']
        -E apm-server.rum.library_pattern="node_modules|bower_components|~"
        -E apm-server.rum.exclude_from_grouping="^/webpack"
        -E apm-server.rum.source_mapping.enabled=true
        -E apm-server.rum.source_mapping.cache.expiration=5m
        -E apm-server.rum.source_mapping.index_pattern="apm-*"
        -E setup.kibana.host=kibana:5601
        -E apm-server.kibana.enabled=true
        -E apm-server.kibana.host=kibana:5601
        -E output.elasticsearch.hosts=["elastic:9200"]
    volumes:
      - logs_data:/logs
      - data01:/usr/share/apm-server/data
    ports:
      - 8200:8200
    depends_on:
      - elastic
    networks:
      - observability

And now in Angular I just send it to localhost:8200 insead of localhost:9200.

const apm = service.init({
      serviceName: 'frontend',
      serverUrl: 'http://localhost:8200/', // APM Server
      serviceVersion: '1.0.0',
    });