So there is a very wierd behaviour going on with m...
# support-questions-legacy
y
So there is a very wierd behaviour going on with my nextjs app. When I close my browser and my server and then reopens everything again open up the website in the browser and if I was already logged in, than when ever I try to fetch data from api, it throws me this error. But then if I logout the error stops coming and error does not come after I login again after logging out. So the error only comes at the very beginning. Why is it so ? And this is superTokens specific bcz you can see in the error pointing to node_modules/supertokens-node.
r
@porcellus can help here
y
Okh. Waiting for the porcellus
And also sometimes it start throwing me failed to verify access token error too
And after this error the wierd behaviour starts happening again explained above
p
hi, could you give me exact version numbers for node, nextjs and our SDKs? AFAIK the cross-fetch should work in the middleware.
y
I am using 13.4.19 version of next js the most latest one and using the latest version of your SDK too
It only gives error when the browser gets opened for the first time when logged in. One time I logout and then login and than it starts working fine
p
hi, I'll try and reproduce it tomorrow, but I don't know of any issues that would cause this. If you had a repo that reproduces this issue that'd make things quicker.
y
Ya will definately provide you the repo tomorrow of the code. Would be really grateful of you if this issue gets resolved
Did a bit of a research on it and found out that this error comes in chrome when using any lib that depends on cross-fetch when working being used in service workers. Is it something familiar to you ?
p
well we are depending on cross-fetch (kind of obvious, I know), but the backend lib isn't supposed to be used in chrome (or in service workers)
I think that doesn't really happen on it's own (but maybe I'm not fully up-to-date on nextjs), did you implement something like that?
Anyway, I think I'll be able to put more focus on this issue in a few hours I'll do a bit more research about this as well. You said you'll provide a repo that reproduces the code. If you could send me a link that'd be really helpful. (if it takes more time ofc that's not an issue either)
y
Okh I am gonna provide the repo to you within an hour. Sorry I am student so I was out for study till now
There you go there's the repo link
Feel free to ask about any thing in the code
p
oh, no worries.
what do I need to do to trigger the issue? What I tried: - start server - sign up - sign in - stop server - stop browser - start server - re-open browser
also, there is an issue in the frontend config where it tries to use a recipe imported from web-js when initializing auth-react
y
Hmm. I see thefronend issue.
Wait I send yo the procede to reproduce the issue
So it does not matter if you are logged in or not, you still get the error.
Just close the browser, the server. And then starts again. I have a useEffect hook in SignUpForm which call one the api and SignUpForm is located in components folder in (site) in app dir. When this error is happening and you are not logged and try to login one more error comes
This error when trying to SignIn when the first cross_fetch error was already coming
I just tried reproducing the error multiple times. It's quite strange that it does not occur everytime. When I usually stop working on any day and then opens laptop the next day, the error comes. Today it also came, but trying to reproduce it again and again it does come every time
p
so the error you screenshotted seems to be coming from a network error trying to connect to the core
I'll try a bit more to reproduce this locally
I'm getting an error on the frontend (some kind of hydration error) but it seems to be unrelated to your original issue. Also, in the first screenshot you posted the error was in the backend logs not on the frontend.
y
Yeah the hydration error does not have to do any with this issue. And the pic that I provided of the error before was on the backend logs bcz I was trying to call the fetch on the server component that's why. If you call it on client, the error will appear on console.
How could I enable the SuperTokens backend logs, maybe I could find any sol of the error by looking at the logs. I saw te docs but does not seem to get it how can I enable it with npm run dev.
p
you need to set the
DEBUG
env var to
com.supertokens
i.e.:
DEBUG=com.supertokens npm run dev
y
Ooh okh
Again the same cross fetch erroris coming. So it means it comes randomly at any time, it is not specific that when it will come. I have attached the both backend and frontend logs for this error
Were you able to reproduce it ?
p
no, not yet
y
I just logged out and error got fixed
p
and you can no longer reproduce it?
y
Yup. After logging out I am not able to reproduce it yet
p
I'm happy it works - although it would've been better if we knew the source of the issues. Please let me know if it crops up again.
y
Okay will let you know
Getting the same exact error again 😭
Is there not a way to not use cross-fetch or if using than use xhr2 with it. Bcz I have seen some people saying using xhr2 solves the error.
r
@porcellus ?
y
?? Any update ?
p
hi, sorry, other priorities got in the way. I'll check out xhr2, but there is no easy way to remove cross-fetch from our lib as far as I know
I don't think
xhr2
would be a solution. One issue is that I still can't seem to reproduce the issue. It's a bit confusing: you were saying it didn't matter if you are logged in or not, do you have any further clues on how to get this error?
y
As far as I have noticed. The issue comes randomly. And it is pretty strange that it only comes when I run the server and open the browser after some hours. There are no SuperTokens logs coming too when the error is coming
This error is coming in chrome. Are you using any other browser ?
Maybe this is because something in the backhood is not Initialized untill I do some thing like login or signup or logout. Because whenever I do any action like login or logout the error goes away and everything starts working fine.
Again the error is happening at the start. It indicates that the error is happening at XMLHTTPREQUEST.onloadend
And as usual after I logged out. The error vanished away. There is something that is not properly done in the start casuing the cross-fetch to give me error and is done after I logout or login or signup.
@porcellus ?
p
Hi, sorry, we are in the middle of a large release and I was busy with that today. - I'm using chrome, the error didn't seem to happen for me even if I left things running for a few hours and came back. - You mentiond that the error is happening at
XMLHTTPREQUEST.onloadend
. That'd be very strange, since earlier the error was about XMLHttpRequest not defined. What is pointing you there? - In the screenshots you posted the errors definitely seem to be happening on the backend (the logs in the first screenshot +
updateSessionData
returning a 500). Can you check what is the response body of
updateSessionData
? - in the repro you posted
updateSessionData
is basically empty - so I guess it must be the middleware throwing. Does this endpoint work when you are not getting this error? - Not initializing could be an issue, but that'd show up as a different error I think - anyway, something you could look into. Maybe add some kind of logging where the initialization happens and check if it is skipped before you start getting the error. One thing you could try is editing the file the error stack is pointing to (the ponyfill in your node_modules) and try to log a full error stack from there. I'll try and look at this again tomorrow, maybe I'll have better luck reproducing this.
y
2. Yah the frontend end is indicating the error on XMlHttpRequest.onloadend bu the logs on the backend saying it is undefined. Frontend may be giving me that logs because trying to read property of undefined. 3. The error logs come on the backend as well as on the frontend. And the updateSessionData api does not even return a res with status 500. It just returns string as a response just for testing purposes. 4. Ya updateSessionData endpoint works fine when not getting this error.
I will try to just change a bit in ponyfill file and update you with the things
And bro there is no problem in replying late. I do understand you have some work and priorities in your life too 😀
Oh so its something have to do with the middleware file. Today I removed it and there was no error coming and then I put it back and the error starts coming again. Please look into that why is that happening.
So did a bit of debugging and found out where the exact error is incoming. Check the middleware file in the repo. I have mentioned where the error is happening exactly with comments
p
so the frontend is not really indicating an error as far as I've seen. Axios is throwing for 500 errors, but that isn't really an error on the frontend, it's just reporting the error response.
I've actually succeeded in reproducing the issue just now, so that's good news. The bad one is that I don't think there will be a quick fix. I'll figure something out, but it likely won't happen today.
y
No probs. Take your sweet time and come up with your answer
Just observed today that this error not only happens right on the start but sometime starts happening in the middle of the dev too
Anyways, Have you got any clues why this error is coming tho ?
@porcellus Any update ?
p
hi
yeah, we've released the next version of the node SDK
you can try using this branch:
npm i supertokens-node@supertokens/supertokens-node#feat/edge_function_compatibility
it should fix your issue, but please let me know
this fix should get released in the normal channel (hopefully later this week), but until then you can try using it like this.
I don't recommend using the branch in production since it will disappear after the changes have been merged.
y
Getting this error when using this branch
r
@porcellus can you make similar changes but for the version that @youscript is using? So that they can test it?
Which backend SDK version are you using @youscript ?
y
"supertokens-auth-react": "^0.34.2", "supertokens-node": "github:supertokens/supertokens-node#feat/edge_function_compatibility", "supertokens-web-js": "^0.7.3",
r
Oh yea, but which version of the node SDK were you using before?
y
I think it was 15.2.0. Not really sure
r
Right. Ok. We can make this change on top of that branch and you can retry
p
I can do that, but based on the repro there should be basically no migration needed for the node SDK upgrade.
r
oh yea, but the core needs to be updated, and we can't do that for the managed service as of yet
p
ooh ok.
y
Just let me know when the changes are done
p
you can try:
npm i supertokens-node@supertokens/supertokens-node#backwards/edge_compatibility_check
y
Okh
Let me try
Using this branch did not fix the error 🥹
p
hmm. what node version are you using?
y
v18.15.0 This one
p
ah, there was an issue backporting the fix. can you reinstall and try again?
r
make sore to remove the node_modules folder and the package-lock as well
y
So I will try it out a little later because right now the error is not coming normally too. So will try it a bit later and inform you about the error status
Yes, finally the error is not coming now. Thanks for listening to me and solving the bug.
r
awesome! we will release the changes to the latest version of our SDK. The branch that you are using will be removed, so it's best if you fork the repo and then use your forked version until we release the changes to the latest SDK version, after which you can upgrade to that (or keep using your forked version)
y
Got it
4 Views