JS transactions not linked to backend using JS/PHP SDK

SDKs
1

I’m trying to setup sentry in our custom framework so I’m able to take advantage of Distributed Tracing, however it doesn’t seem to be working as expected.

I added the JS SDK to the top of our homepage:

<script src="https://browser.sentry-cdn.com/5.30.0/bundle.tracing.min.js">
</script>
<script>
    Sentry.init({
        dsn: 'https://example.dns.com',
        release: '123456',
        environment: 'local',
        integrations: [new Sentry.Integrations.BrowserTracing()],
        tracesSampleRate: 1.0,
    });
</script>

And by itself it tracks performance metrics fine, I also added the PHP SDK to our backend and just for testing I started tracing from the beginning to the end of my homepage request. I’m using a head tag to link both together, eg:

<meta name="sentry-trace" content="584f18f4483a4b4c83bb810a5b9ebc7d-37f9fd769ff64740-1">

However this creates 2 transactions in my Sentry Performance page, one for the backend and one for the frontend. I was expecting to see just one and have the frontend request be a children of the backend request but this is not happening (or maybe I misunderstood the way it should work).

My backend transaction comes in first and it looks like this:
Backend trace

Then the frontend one comes in after a few seconds and looks like this:

Screenshot 2021-01-18 at 22.23.05
Screenshot 2021-01-18 at 22.23.052366×1050 222 KB

Notice the Parent Span ID and Trace ID in the child match the parent’s so technically it should work. I feel like I’m doing something obviously wrong here but not sure what.

Can anyone advice what to do?

Thanks.

2 Likes
2

I’m currently dealing with the same issue; but hooked up to an SPA.
It seems like I’m missing a configuration to actually set them up; but I can’t find anything in the docs about it