grafana / faro-web-sdk

The Grafana Faro Web SDK, part of the Grafana Faro project, is a highly configurable web SDK for real user monitoring (RUM) that instruments browser frontend applications to capture observability signals. Frontend telemetry can then be correlated with backend and infrastructure data for full-stack observability.
https://grafana.com/oss/faro/
Apache License 2.0
690 stars 62 forks source link

[HELP] POST Request is being blocked with a 504 error #567

Closed jvinters closed 2 months ago

jvinters commented 2 months ago

Posted tracing requests are being blocked with a 504 error (service worker)

Instrumentation seems to be working correctly, spans are being generated, when the request is POSTed there's a 504 blocked error. I can take the same request and send it from postman with no issue.

On a Angular 18, with service worker.

I believe its an issue with the server worker blocking the request.

How can I add a header (ngsw-bypass=true) to each tracing request? I tried an HttpInterceptor but I assume the service has its own HttpClient dependency so I cannot figure out how to supply my own Interceptor.

codecapitano commented 2 months ago

Hi @jvinters Yes Faro has it's own services to send data, called transports.

By default Faro uses the FetchTransport. The FetchTransport allows you to add custom headers.

To do so, you need to initialize a customized FetchTransport in the Faro init code.

initializeFaro({
  // ...

  transports: [
    new FetchTransport({
      url: `http://my-endpoint/collect/api-key`,
      requestOptions: {
        headers: { foo: 'bar' },
      },
    }),
  ],

  // ...
});
jvinters commented 2 months ago

Hello, thanks for the quick response.

I was able to add the headers with the above code. The request is still failing. Now the status just says "blocked:other" and the console says "ERR_BLOCKED_BY_CLIENT" and "TypeError: Failed to fetch".

Any ideas on how to solve this?

codecapitano commented 2 months ago

@jvinters could you solve the problem and can we close the issue?

jvinters commented 2 months ago

@codecapitano No I cannot solve this problem, which Is why I asked for help. Please reopen, this issue is not closed.

codecapitano commented 2 months ago

Oh dang, I closed the issue by accident.

codecapitano commented 2 months ago

@jvinters do you have any privacy extensions like adblockers running? The ERR_BLOCKED_BY_CLIENT mostly occurs when an extension is blocking a request.

Does it happen when all extensions are turned off (also the built-in extensions of the browser, if any).

jvinters commented 2 months ago

@codecapitano Yes it happens with adblock disabled. Also happens on firefox and edge which don't have any extensions.