Skip to content

CLIENT_FETCH_ERROR expected end of JSON input (next-auth + SST) #7797

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
3 tasks done
hect1c opened this issue Apr 8, 2023 · 16 comments
Closed
3 tasks done

CLIENT_FETCH_ERROR expected end of JSON input (next-auth + SST) #7797

hect1c opened this issue Apr 8, 2023 · 16 comments
Labels
Package: nextjs Issues related to the Sentry Nextjs SDK

Comments

@hect1c
Copy link

hect1c commented Apr 8, 2023

Is there an existing issue for this?

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using? If you use the CDN bundles, please specify the exact bundle (e.g. bundle.tracing.min.js) in your SDK setup.

@sentry/nextjs

SDK Version

7.47.0

Framework Version

Next 13.3.0

Link to Sentry event

No response

SDK Setup

No response

Steps to Reproduce

https://github.com/hect1c/nextjs-sentry-nextauth-lambda-error

I'm getting the CLIENT_FETCH_ERROR unexpected end of JSON input when loading the site. It's a bit odd as I was able to isolate the issue to my next.config.js. It appears it's related to my @sentry/nextjs configuration. When I have the withSentryConfig set I get this error from next auth, but when I remove it no error and next-auth is happy. I've tried to debug next-auth to try and determine why it's giving me this error but to no avail. I definitely have everything set it up it should be for next-auth and my withSentryConfig is directly from the docs.

I've tried different versions across next, next-auth and sentry but going back too far with my @sentry/nextjs config is just not an option.

Though the error is coming from next-auth I've decided to post here as I was hoping you would be able to point me in the right direction as to what may be causing this as I have not been able to figure it out aside from just removing withSentryConfig and setting module.exports = nextConfig in the repro. I'm just not sure why a sentry config would affect next-auth in any way. I've also posted an issue at next-auth here: nextauthjs/next-auth#7200

Expected Result

What should of happened is no error is displayed since I have the required environment variables and nextauth path setup correctly even with my @sentry/nextjs configuration

Actual Result

image

Site loads with this error from next-auth

@hect1c
Copy link
Author

hect1c commented Apr 9, 2023

So after further debugging I was able to see that the issue came specifically from here https://github.com/getsentry/sentry-javascript/blob/develop/packages/nextjs/src/config/webpack.ts#L166-L183. I think this was done in order to wrap api routes with some sentry magic and re-export to ensure this would provide the necessary debugging information in sentry but for some reason this was breaking my next-auth which uses the /api/auth/[...nextauth].ts path (https://next-auth.js.org/getting-started/example#add-api-route).

Luckily I found in the code that you guys have an option excludeServerRoutes which is also exposed and can be configured in next.config.js. I don't need auto-instrumentation on this particular route so disabling it is fine but maybe this is something that may need to be looked into and handled appropriately.

This caused me a long week of headache trying to figure out why my next-auth wasn't working. I found a lot of issue reports around CLIENT_FETCH_ERROR with next-auth and one in particular that mentioned @sentry/nextjs but their solutions didn't work. I also thought my issue was with next-compose-plugin.

To reference a few for linking:

For those that do happen to come here my solution was to disable it on this specific route so my next.config.js looks like this:

next.config.js

...
const sentryWebpackPluginOptions = {
  debug: false,

  // enable if too noisy in console
  silent: true,

  // Additional config options for the Sentry Webpack plugin. Keep in mind that
  // the following options are set automatically, and overriding them is not
  // recommended:
  //   release, url, org, project, authToken, configFile, stripPrefix,
  //   urlPrefix, include, ignore
  // For all available options, see:
  // https://github.com/getsentry/sentry-webpack-plugin#options
}

module.exports = (phase, { defaultConfig }) => {
  const nextPlugins = [
    withBundleAnalyzer,
    (nConfig) =>
      withSentryConfig(
        {
          ...nConfig,
          sentry: {
            // https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/#opt-out-of-auto-instrumentation-on-specific-routes
            excludeServerRoutes: ['/api/auth/[...nextauth]'],
          },
        },
        sentryWebpackPluginOptions,
      ),
  ]

  const config = nextPlugins.reduce(
    (prev, plugin) => {
      const update = plugin(prev)
      return typeof update === 'function'
        ? update(phase, defaultConfig)
        : update
    },
    { ...nextConfig },
  )

  return config
}

I will leave this open for now to see what Sentry team will say about this but happy to close it as I don't think again auto instrumentation is required on this path. NextAuthJs also provides a logger option https://next-auth.js.org/configuration/options#logger that may be used to log errors / warnings that I think can be used to log outputs to Sentry, haven't tried or confirmed this yet.

@lforst
Copy link
Contributor

lforst commented Apr 11, 2023

Hi, thanks for reporting this!

I will leave this open for now to see what Sentry team will say about this but happy to close it as I don't think again auto instrumentation is required on this path.

First of all, let's leave this open. Nobody should run into an issue like this and we would also still like to instrument the auth endpoint.

As for the actual issue, I myself am using next-auth and Sentry in one of my side projects and didn't run into any issues with Sentry. I remember seeing similar errors but I remember I could pinpoint them to some misconfigurations I did myself - or the auth provider returning an error.

A few questions:

  • Is the symptom here just an error appearing in the console or actual application behaviour changing?
  • Can I ask you for a small reproduction example we can clone and run ourselves? Right now it's hard to say where the issue may originate from.
  • Do you happen to have some special CORS configuration? Or do you know whether your auth provider does?

@lforst lforst added Package: nextjs Issues related to the Sentry Nextjs SDK and removed Status: Untriaged labels Apr 11, 2023
@hect1c
Copy link
Author

hect1c commented Apr 12, 2023

Hey,

Yea fair enough, in hindsight if Sentry can auto instrument as much as reasonably possible that would be preferred.

I thought it was weird I ran into it as well, but I did move to a new technology stack using AWS lambda with SST and while setting that up I then got this issue so not sure if it could be related.

  • Both - it was showing the error in the console and was also completely disabling my ability to log into the app. I also did notice that my api/auth/session route was acting weird and giving me an unexpected end of JSON input in the console when visiting that route
  • I did provide a reproduction in my first post: https://github.com/hect1c/nextjs-sentry-nextauth-lambda-error but the only issue with this is you would require an AWS account as I'm using SST (open-next) to deploy my app on AWS Lambda. I did not get the issue locally but then again this may be because I was not running Sentry locally and I was using next dev server. If you were to set it up to use next build, next start and ensure that Sentry does it configuration then you may be able to reproduce the error with that reproduction.
  • I was just using simple Credentials provider this can be seen in the reproduction. As for CORS configuration will take a look as SST is using cloudfront and does add some configurations and policies there

Once I excluded the api path and the error stopped then I was able to login successfully in the app.

@TheCovenant
Copy link

TheCovenant commented Apr 20, 2023

Thanks for sharing your solution @hect1c. I also ran into this problem and don't think I could have figured out what was causing it on my own.

Interestingly enough, I am also using SST to deploy my app. This makes me think that SST is a factor in what is causing this issue.

Can confirm that adding ['/api/auth/[...nextauth]'] to excludeServerRoutes fixed the issue. After making this change I had to clear cookies and cache in my browser for login functionality to start working again.

@lforst
Copy link
Contributor

lforst commented Apr 20, 2023

While I do not know for sure yet, SST might be a contributing factor here. I have to check - sadly can't give a timeline right now. Any additional information as to what SST does or might do is useful for me to debug!

@lforst lforst changed the title CLIENT_FETCH_ERROR expected end of JSON input (next-auth) CLIENT_FETCH_ERROR expected end of JSON input (next-auth + SST) Apr 20, 2023
@hect1c
Copy link
Author

hect1c commented Apr 20, 2023

Hmm I did consider the issue may be with SST but as I was able to isolate it to Sentry I didn't pursue further with SST. I am on their discord channel so may revisit this.

@lforst You can find more info here https://sst.dev but essentially it's a framework that allows us to easily build and deploy our stacks to AWS Lambda and many other AWS services. In particular they have also open sourced a Nextjs builder called open-next https://github.com/serverless-stack/open-next which is where if there is an issue would be found as this builds and packages our NextJS app for deployment to the relevant AWS services.

I think it would still be good to understand what Sentry is doing in particular and in the meantime I can check with the maintainers on the channel to understand what could potentially be causing this on that end and provide a link to the code so we can try and pinpoint this issue.

@github-actions
Copy link
Contributor

This issue has gone three weeks without activity. In another week, I will close it.

But! If you comment or otherwise update it, I will reset the clock, and if you label it Status: Backlog or Status: In Progress, I will leave it alone ... forever!


"A weed is but an unloved flower." ― Ella Wheeler Wilcox 🥀

@github-actions
Copy link
Contributor

This issue has gone three weeks without activity. In another week, I will close it.

But! If you comment or otherwise update it, I will reset the clock, and if you label it Status: Backlog or Status: In Progress, I will leave it alone ... forever!


"A weed is but an unloved flower." ― Ella Wheeler Wilcox 🥀

@github-actions github-actions bot closed this as not planned Won't fix, can't repro, duplicate, stale Jun 23, 2023
@yarinsa
Copy link

yarinsa commented Jul 26, 2023

This issue caused me a lot of pain. Unfortunately this my 2nd lifetime trying to solve frustrating error that hurt crucial functionality... It would be appreciated if Sentry product team will consider this and add this to the docs.
#5598

@getsantry getsantry bot moved this to Waiting for: Product Owner in GitHub Issues with 👀 Jul 26, 2023
@lforst
Copy link
Contributor

lforst commented Jul 31, 2023

@yarinsa What exactly would you like to have added to the docs?

Our docs are also open source so feel free to contribute any changes: https://github.com/getsentry/sentry-docs

@yarinsa
Copy link

yarinsa commented Jul 31, 2023

@lforst That there is a known issue with next auth ...

@leog
Copy link

leog commented Jan 22, 2024

Also bumping into this issue, wasted time till I found this ticket, please be sure to expose a bit better this kind of issue to at least avoid someone else having to waste time.

@lforst
Copy link
Contributor

lforst commented Jan 23, 2024

@leog If you have concrete suggestions on what to document feel free to share your thoughts here or open a PR to our docs. We'll make sure it gets added.

As it stands however, we are not aware of any conflicts with next-auth. I am using next-auth + Sentry in my personal project and I have no issues.

If you have issues with SST + Sentry, I recommend opening an issue in their Repo. I have a hunch that they are doing some funky stuff that is incompatible. We are doing our best not to screw with anything.

@leog
Copy link

leog commented Jan 24, 2024

thank you @lforst for your input, I will try to find a good place to warn people about the usage of Sentry together with Open-Next and SST as it happened in my project. In the mean time I linked this issue to SST open-next project to follow up with them if there is anything to fix on their side.

@joshsny
Copy link

joshsny commented Apr 25, 2024

Just to add some more data to the issue, I have a deployment hosted on Vercel that is also experiencing this for a portion of users. Does not seem to be SST related.

@lforst
Copy link
Contributor

lforst commented Apr 26, 2024

@joshsny thanks for the heads up!

Just so that nobody is surprised, I will lock this issue for organizational purposes (No ill will intended! 😄). The "+1s" in this issue are not too helpful and this issue being kept open is incentivizing people to bandwagon. To have a meaningful investigation we would need a bit more detailed bug reports with reproduction examples.

If you have issues similar to this one, please open a new issue and provide a minimal reproduction example. Feel free to reference this issue in your new issues. Thank you!

@getsentry getsentry locked and limited conversation to collaborators Apr 26, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Package: nextjs Issues related to the Sentry Nextjs SDK
Projects
Archived in project
Development

No branches or pull requests

7 participants