https://supertokens.com/ logo
Join Discord
Powered by
hi i have a problem with passwordless auth in reac...
# support-questions-legacy
n
hi i have a problem with passwordless auth in react. i want to call an api in the useEffect of APP.tsx but when i try i recive error 401, is it my bad ?
r
hey! which API is returning 401? Is it your own API or an API exposed by supertokens?
n
my own
r
can you enable backend and frontend logs and show us the output?
n
Copy code
{
  "message": "Request failed with status code 401",
  "name": "AxiosError",
  "config": {
    "transitional": {
      "silentJSONParsing": true,
      "forcedJSONParsing": true,
      "clarifyTimeoutError": false
    },
    "transformRequest": [
      null
    ],
    "transformResponse": [
      null
    ],
    "timeout": 0,
    "xsrfCookieName": "XSRF-TOKEN",
    "xsrfHeaderName": "X-XSRF-TOKEN",
    "maxContentLength": -1,
    "maxBodyLength": -1,
    "env": {
      "FormData": null
    },
    "headers": {
      "Accept": "application/json, text/plain, */*",
      "rid": "anti-csrf"
    },
    "method": "get",
    "url": "http://localhost:8080/user-info/my-info",
    "withCredentials": true
  },
  "code": "ERR_BAD_REQUEST",
  "status": 401
}
fe error
r
n
fe log
r
and backend?
n
in back end are all private path i try to delete it and send
r
can i see the logs that happen on the backend when you call the API?
n
in the last file there are, no?
the log before?
r
Well, the first entry in that is from 
errorHandler
. There should probablty be some logs before too which resulted in 
errorHandler
being called
n
ok this are all logs
r
sure? Cause this too has errorHandler as the first entry
can you make the API call again that gives 401, and then send all the logs it has pleas\e?
n
sorry for the last this are all
r
hmm. so the session verification succeeds.
this is probably not the right API call's log
oh wait.
got it
so the issue is that the cookies are not being sent at all. Are you adding the axios interceptor on the frontend?
when using axios
n
Axios.tsx:
export const axiosInstance = axios.create({ /*...*/ });
App.tsx:
Session.addAxiosInterceptors(axiosInstance);
is this the problem?
r
no this seems fine too
So can I see just the frontend logs that are generated when you call the API?
Just the logs which happen during the API call
n
r
hmm. Are you using a custom UI?
n
palette: { superTokensBrandingBackground: "#fff", superTokensBrandingText: "#fff", // .
but in the fututre we need
more
r
oh so our using our UI
For some reason, it seems that the frontend doesn't have cookies set
can you send me a screenshot of the cookie store after sign in
and also the response headers from the sign in API call (as seen on chrome)
n
r
so that seems fine too.. so strange
n
my info is my api
the call of my-info is befor the code api that is bad
r
oh. so my-info is getting called before
it should be called after
thats why it's returning 401
n
so i can't call it in the useEffect
of app.tsx
r
yea.. maybe call it only if a session exists, and you can check if a session exists by using the session recipe
Copy code
await Session.doesSessionExist()
n
ok but this is a config api for populate all interface so i have to call it at the start o application
r
do you want to call it only when the session exists or even if it doesn't exist?
n
i need the user context
so the session must be exist
r
hmm
well, you can add logic to our onHandleEvent function in which once a user signs in, you can re trigger the API and set the state again
n
yes i try to do that
3 Views
PreviousNext
Powered by