Description
Problem Statement
We run Angular in ssr mode and use Sentry to track errors. The errors themselves come through, but they don't have any metadata associated, since the angular sdk expects to run in a browser.
It would be great, if Sentry would automagically collect metadata from the ssr environment.
Solution Brainstorm
We managed to get some meta information added but had to jump through quite a few hoops:
- Inject node integration token into angular:
tokens.ts
import { type Integration } from '@sentry/types';
export const SSR_SENTRY_INTEGRATIONS = new InjectionToken<Integration[]>(
'SSR_SENTRY_INTEGRATIONS'
);server.ts
import * as Sentry from '@sentry/node';
...
await commonEngine.render({
....
providers: [
{ provide: APP_BASE_HREF, useValue: baseUrl },
{ provide: RESPONSE, useValue: res },
{ provide: REQUEST, useValue: req },
{
provide: SSR_SENTRY_INTEGRATIONS,
useValue: [
sentry.requestDataIntegration(),
sentry.nodeContextIntegration(),
],
},
],
});- Extend the sentry ErrorHandler
constructor(
@Optional() @Inject(SSR_SENTRY_INTEGRATIONS) private ssrIntegrations: Integration[],
@Optional() @Inject(REQUEST) private request: Request
){
super();
if(this.ssrIntegrations){
for (const integration of this.ssrIntegrations) {
Sentry.addIntegration(integration);
}
}
}
handleError(error: any) {
if (this.request) {
Sentry
.getIsolationScope()
.setSDKProcessingMetadata({
request: this.request,
});
}
super().handleError(error)
}The main challenge was that if we loaded the node integrations directly(or even lazy), we would get compilation errors, since the frontend code would complain that there's no node api. By injecting the integrations from server.ts, we managed to avoid those errors, since sentry node will never appear in a browser bundle.
I hope that makes some sense but I have no idea, how viable it is to integrate into the sdk.
Metadata
Assignees
Type
Projects
Status
Waiting for: Community
Activity