https://supertokens.com/ logo
cors issue
r

Raf

05/05/2023, 6:39 PM
Question supertokens React SDK: Does anybody know where the SDK makes the modifications to Access-Control-Request-Headers to add "st-auth-mode"? I'm not 100% but there might be a bug in there when working with fastapi. Here is my reasoning: 1. I get a 400 on OPTIONS when trying to do a POST. The usual CORS, not allowed blah blah blah 2. FastApi is setup the same way as the recipe: allow_headers=["Content-Type"] + get_all_cors_headers(), With the above config, fastapi will respond with: Accept, Accept-Language, Content-Language, Content-Type, anti-csrf, authorization, fdi-version, rid, st-auth-mode but the request came in with: access-control-allow-origin,content-type,rid,st-auth-mode and the browser blows up with CORS error. If I use a wild card in fastapi: allow_headers="*", then everything works fine I'm not super familiar with how this works, can somebody shed some light why this does not work without a wildcard?
r

rp

05/06/2023, 4:55 AM
hey @Raf this does not seem like a bug in the sdk, rather an issue with your cors cnfig on the backend - what's the exact cors error on the browser?
r

Raf

05/06/2023, 1:23 PM
400 Bad request
r

rp

05/06/2023, 1:25 PM
That seems to be a cors related issue the You might wanna see the docs of the cors lib being used.
r

Raf

05/06/2023, 1:27 PM
CORS config on the backend is 100% as in the recipe in the docs:
app = FastAPI()
app.add_middleware(get_middleware())

app.add_middleware(
    CORSMiddleware,
    allow_origins=[
        "http://localhost:4173",
        "http://localhost:5173",
        "http://0.0.0.0:5173",
        "http://192.168.0.17:5173"
    ],
    allow_credentials=True,
    allow_methods=["GET", "PUT", "POST", "DELETE", "OPTIONS", "PATCH"],
    allow_headers=["Content-Type"] + get_all_cors_headers(),  
)
but this works perfectly fine:
app.add_middleware(
    CORSMiddleware,
    allow_origins=[
        "http://localhost:4173",
        "http://localhost:5173",
        "http://0.0.0.0:5173",
        "http://192.168.0.17:5173"
    ],
    allow_credentials=True,
    allow_methods=["GET", "PUT", "POST", "DELETE", "OPTIONS", "PATCH"],
    allow_headers=["*"],
)
and with the recipe config, it's only the OPTIONS on a POST request that fails
r

rp

05/06/2023, 1:30 PM
So it’s get_all_cors_headers that’s causing it to fail?
r

Raf

05/06/2023, 1:40 PM
looks like it
what I think is happening is that when a wildcard is used in fastapi, the server just takes whatever the client sent and sends it back as accepted-headers and everything works
I'm still looking through the code base to see if there is any other lib that might be adding any type of axios defaults that might be messing this up from the client side
r

rp

05/06/2023, 2:10 PM
Right. I’m not sure why this could be happening. Have you tried our demo app using the CLI? That works as expected. Maybe see the differences between that and your app
r

Raf

05/06/2023, 5:10 PM
I found the culprit. There was a leftover code from trying some of the lib: axios.defaults.headers['Content-type'] = 'application/json'; axios.defaults.headers.post['Access-Control-Allow-Origin'] = '*';
r

rp

05/06/2023, 5:10 PM
Right! That’s great
r

Raf

05/06/2023, 5:10 PM
Sorry for waisting your time