https://supertokens.com/ logo
Channels
Powered by
f

funk101

06/02/2022, 5:18 AM
I have "staging" and "production". Production is set to "www.example.com" in appInfo(). So, "staging.example.com" is getting this error. I'm assuming this has to do with the "appInfo()" logic: 
Access to fetch at 'https://www.finicky.pet/api/auth/session/refresh' from origin 'https://staging.finicky.pet' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header has a value 'https://www.finicky.pet' that is not equal to the supplied origin. Have the server send the header with a valid value, or, if an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
n

nkshah2

06/02/2022, 5:21 AM
Hi, Your frontend should be configuring appInfo differently for the two environments
f

funk101

06/02/2022, 5:22 AM
frontendConfig() or appInfo()?
here's my appInfo()
Copy code
export const appInfo = {
  // learn more about this on https://supertokens.com/docs/emailpassword/appinfo
  appName: "finicky.pet-v4",
  apiDomain: process.env.NEXT_PUBLIC_HOST,
  websiteDomain: process.env.NEXT_PUBLIC_HOST,
  apiBasePath: "/api/auth",
  websiteBasePath: "/auth",
};
n

nkshah2

06/02/2022, 5:23 AM
Right and you use that on the Frontend as well correct?
f

funk101

06/02/2022, 5:24 AM
yeah, but NEXT_PUBLIC_HOST is actually set to the right url on staging
n

nkshah2

06/02/2022, 5:25 AM
Can you enable debug logging on both the frontend and backend and post the output here?
f

funk101

06/02/2022, 5:25 AM
ok, have to commit to staging, please hold
hmm not getting any readout
n

nkshah2

06/02/2022, 5:29 AM
On your frontend and backend? Or one of them?
f

funk101

06/02/2022, 5:30 AM
none of them, let me try firefox
n

nkshah2

06/02/2022, 5:30 AM
What version of the SDKs are you using?
f

funk101

06/02/2022, 5:32 AM
np made me install a couple of weeks ago, so I could debug
rp
*made me upgrade
n

nkshah2

06/02/2022, 5:32 AM
Strange, can you log the value of appInfo yourself?
f

funk101

06/02/2022, 5:33 AM
my version: `
"supertokens-auth-react": "^0.21.3", "supertokens-node": "^9.2.0",`
n

nkshah2

06/02/2022, 5:34 AM
Yep that should work, try logging appInfo before passing it to SuperTokens yourself and we can debug from there
f

funk101

06/02/2022, 5:35 AM
you mean just "console.log(appInfo())" ?
n

nkshah2

06/02/2022, 5:35 AM
Yep
f

funk101

06/02/2022, 5:35 AM
or appInfo, no brackets, right
no parens I mean
n

nkshah2

06/02/2022, 5:35 AM
The exact way you are passing it to SuperTokens would work best
f

funk101

06/02/2022, 5:38 AM
ok, so when I run on localhost, the debugging works, but staging doesn't debug
I'm checking console.log(appinfo) now
n

nkshah2

06/02/2022, 5:38 AM
Does your staging environment disable console logging in any way?
f

funk101

06/02/2022, 5:39 AM
staging is on Vercel, so, I assume it's not allowing
actually, Vercel does allow console. logging but this CORS error seems to intercept everything right now
n

nkshah2

06/02/2022, 5:40 AM
Debug logging for SuperTokens would trigger before you make any network requests so it should work
f

funk101

06/02/2022, 5:40 AM
this -> 
Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header has a value 'https://www.finicky.pet' that is not equal to the supplied origin.
n

nkshah2

06/02/2022, 5:40 AM
Anyways lets see if your log goes through
f

funk101

06/02/2022, 5:40 AM
no it doesn't
n

nkshah2

06/02/2022, 5:41 AM
Can you check the request headers + response headers in the browser?
f

funk101

06/02/2022, 5:42 AM
they look ok
getting a 200
plus, host = staging.finicky.pet
n

nkshah2

06/02/2022, 5:43 AM
So the error is saying that your backend is expecting requests from 
https://www.finicky.pet
and not 
staging.finicky.pet
f

funk101

06/02/2022, 5:43 AM
this 'Access-Control-Allow-Origin' point so to production
right
n

nkshah2

06/02/2022, 5:44 AM
Which is why you are getting CORS errors
If I understand correctly you have two environments for your frontend (staging and production)
Does your backend also have two environments?
f

funk101

06/02/2022, 5:45 AM
well, how do I answer that? I think yes would be the answer
where is that code for 'Access-Control...'?
n

nkshah2

06/02/2022, 5:46 AM
On the backend when you setup cors (using the steps in our docs) it adds it based on the value of 
websiteDomain
you pass to SuperTokens.init
f

funk101

06/02/2022, 5:46 AM
right which is an .ENV variable
and is set in Vercel
n

nkshah2

06/02/2022, 5:47 AM
Yep but from the error it looks like the backend always uses the production url
f

funk101

06/02/2022, 5:48 AM
both front and back configs are pulling in "appInfo", so it's the same
n

nkshah2

06/02/2022, 5:49 AM
So debug logs would really help here, can you look into why Vercel isnt showing the logs?
The CORS error wont block any logs so its not that
f

funk101

06/02/2022, 5:53 AM
This is my /api/auth code
Copy code
export default async function superTokens(req, res) {
  // NOTE: We need CORS only if we are querying the APIs from a different origin
  await NextCors(req, res, {
    methods: ["GET", "HEAD", "PUT", "PATCH", "POST", "DELETE"],
    origin: process.env.NEXT_PUBLIC_HOST,
    credentials: true,
    allowedHeaders: ["content-type", ...supertokens.getAllCORSHeaders()],
  });

  await superTokensNextWrapper(
    async (next) => {
      await middleware()(req, res, next);
    },
    req,
    res
  );
  if (!res.writableEnded) {
    res.status(404).send("Not found");
  }
}
this at top -> 
supertokens.init(backendConfig());
I see this in firefox now
Copy code
Status
500
Internal Server Error
VersionHTTP/2
Transferred424 B (0 B size)
Referrer Policystrict-origin-when-cross-origin
r

rp

06/02/2022, 5:59 AM
which API are you querying which is giving a 500 error?
Can you add a try/ catch around this:
Copy code
await superTokensNextWrapper(
    async (next) => {
      await middleware()(req, res, next);
    },
    req,
    res
  );
And log the error?
f

funk101

06/02/2022, 6:01 AM
ok
this is the api error
r

rp

06/02/2022, 6:03 AM
you need to send a POST request to it
if i send a POST request using postman, it returns a 401 - unauthorised error
f

funk101

06/02/2022, 6:04 AM
yes, I have staging and production "whitelisted" now, so you will get that, I'm sure that's it
only my ip can access
r

rp

06/02/2022, 6:04 AM
right.
so it does return 401 as expected (for me)
f

funk101

06/02/2022, 6:04 AM
yes
r

rp

06/02/2022, 6:05 AM
what origin are you querying it from?
And what is the value of 
process.env.NEXT_PUBLIC_HOST
?
f

funk101

06/02/2022, 6:05 AM
locally it's my localhost; staging is => staging.finicky.pet
production is www.finicky.pet
r

rp

06/02/2022, 6:06 AM
and you are querying the API from which domain?
f

funk101

06/02/2022, 6:07 AM
well, works fine on production, and localhost(development), staging is the only issue. I assume, according to all the logic, I'm querying staging API
make sense?
I'm getting no console.log on staging cause that CORS error just takes over, however the page loads though
r

rp

06/02/2022, 6:08 AM
you should be querying the staging API, and if you have set 
NEXT_PUBLIC_HOST
correctly, it should work
f

funk101

06/02/2022, 6:08 AM
yes
it is, page loads, but I get the CORS error
r

rp

06/02/2022, 6:08 AM
what is the response headers from the CORS API?
f

funk101

06/02/2022, 6:10 AM
Request URL: https://www.finicky.pet/api/auth/session/refresh Referrer Policy: strict-origin-when-cross-origin
clearly, it wants production
r

rp

06/02/2022, 6:10 AM
well, are you setting the apiDomain correctly on the frontend?
f

funk101

06/02/2022, 6:10 AM
yes, we went through this a week ago, or so?
r

rp

06/02/2022, 6:11 AM
which API should it query?
f

funk101

06/02/2022, 6:11 AM
appName: "finicky.pet-v4", apiDomain: process.env.NEXT_PUBLIC_HOST, websiteDomain: process.env.NEXT_PUBLIC_HOST, apiBasePath: "/api/auth", websiteBasePath: "/auth",
r

rp

06/02/2022, 6:11 AM
the prod one or the staging one?
f

funk101

06/02/2022, 6:11 AM
i'm trying access staging, but it sends and error that it's being refused by www.finicky.pet
right?
r

rp

06/02/2022, 6:12 AM
if you want it to query https://staging.finicky.pet/api/auth/*, you need to set he apiDomai to https://staging.finicky.pet
f

funk101

06/02/2022, 6:12 AM
it is on Vercel
the .env are diff for dev, staging, and production
they are set properly I've checked and rechecked
r

rp

06/02/2022, 6:13 AM
Can you add a console log in the frontend config to print out the value of 
process.env.NEXT_PUBLIC_HOST
? You should see that console log on the browser console
f

funk101

06/02/2022, 6:13 AM
in my next.config, I have 
reactStrictMode: true
is that a problem?
r

rp

06/02/2022, 6:13 AM
shouldn't be
also, here is ablog we have to deploying on vercel. Might help: https://supertokens.com/blog/how-to-deploy-supertokens-with-react-nodejs-express-on-vercel
f

funk101

06/02/2022, 6:14 AM
OK, i'm using nextjs though
r

rp

06/02/2022, 6:17 AM
well, please make sure that the value of 
NEXT_PUBLIC_HOST
is correct - print it out on the browser console to make sure
f

funk101

06/02/2022, 6:17 AM
man, I can't get any console.log to show! the CORS error just, I don't know, prevents it
doesn't make sense
r

rp

06/02/2022, 6:18 AM
it shows just a coming soon page
can you make it so that I can get the error too on my machine?
f

funk101

06/02/2022, 6:18 AM
whitelisted
ok, what's your ip?
r

rp

06/02/2022, 6:19 AM
DM'd you
2 Views
Powered by