faro-web-sdk: Error when sending data to the server when body size > 64kb and keepalive fetch option enable.
Description
The issue come from the keepalive options in the FetchTransport: https://github.com/grafana/faro-web-sdk/blob/88011e78770c1821a81203c46966b6032addc1ec/packages/web-sdk/src/transports/fetch/transport.ts#L55
When removing it the bug disapear.
This bug only happen when:
- Using DocumentLoadInstrumentation from @opentelemetry/instrumentation-document-load
- Spliting chunk (https://webpack.js.org/plugins/split-chunks-plugin/) whatever configuration
- Using FetchInstrumentation from @opentelemetry/instrumentation-fetch
- Using BatchSpanProcessor from @opentelemetry/sdk-trace-base
- Using XMLHttpRequestInstrumentation from @opentelemetry/instrumentation-xml-http-request
Steps to reproduce
Using all informations said above to configure faro and your project.
Expected behavior
Trace corretly exported.
Actual behavior
Trace are not exported because of the error screenshot in description
Environment
- SDK version: 1.0.2
- SDK instrumentations: 1.0.2
- Device type: computer
- Device name: Dell inspiron
- OS: Ubuntu 20.04
- Browser: Chrome latest
Demo
It is working fine without customizing splitChunks on the same projet with a npm run serve in local. (Possibility that is not working with a build as it’s the default configuration)
If I copy paste the load as curl in terminal it is working fine. If I copy past as fetch and use it directly in my code it’s working fine.
If I use the SimpleSpanProcessor it’s working.
The request block in pending even if the promise already rejected:
Other call to grafana-agent in the same page are working fine.
In the zone.js:975 file from the stack trace the line is: return patchDelegate(this, arguments);
If I do a console.log(patchDelegate, this, arguments)
I get:
Important to note the Exception: TypeError: in the callee do not appear just here but in other above call so it can be a wrong path to follow
In the fetch.js:233 file from the stack trace the line is: return original.apply(this, args); -> The issue STILL happen when we remove the fetch instrumentation
If I do a console.log(original, original.apply, this, args)
I get:
About this issue
- Original URL
- State: closed
- Created a year ago
- Comments: 16 (6 by maintainers)
Hey thanks a lot @alioshr
With
keepaliveenable fetch will send all remaining/pending requests even a app is unmounted or a user navigates away from a page. This is to ensure that no data gets lost.Yes I’m also very confused by this problem.
My current idea is that we may run into the the body size limit for
keepaliverequests (64kiB). If this limit is reached fetch returns a network error.No good news yet but we’ll fix it eventually.
Hey @alioshr no no it’s absolutely no bugging at all! We at Grafana and of course myself too are very very happy about all the input we receive. It’s absolutely stunning for us how the community cares and invests time to help us improve things. ❤️ So please keep asking and raise issues 😃
In case you mean by “fully isolated” that all pending requests are dropped once the app is unmounted or a user leaves the page then I would say yes. But this would also mean that you loose some data points aka signals.
Cheers, Marco
Hi @AMontagu sorry unfortunately I have no updates on this. We already thought internally about hoe to tackle it and have some ideas.
A precondition is to tackle this issue and then we can build on top of it: https://github.com/grafana/faro-web-sdk/issues/261
Hello @codecapitano
Have you any update on this ? we miss a lot of trace and log because of this limitation.
@codecapitano I think you hit the good point for 64kiB. As it happen only when trace are at a specific size.
We had some issues to reproduce because in an empty project we didn’t reach this size. Busy until friday but will definitely try to flood traces with a lot of data to see if it raise the issue.