I have a supabase edge function that works just fi...
# help
b
I have a supabase edge function that works just fine with postman, but when I try and fetch() in my react app, I keep getting CORS. Anyone experience this? Tried setting access origin on the server edge function to “*” as well as local host, but still no luck.
n
Hello @bsnow! This thread has been automatically created from your message in #843999948717555735 a few seconds ago. We have already mentioned the @User so that they can see your message and help you as soon as possible! Want to unsubscribe from this thread? Right-click the thread in Discord (or use the ``...`` menu) and select "Leave Thread" to unsubscribe from future updates. Want to change the title? Use the ``/title`` command! We have solved your problem? Click the button below to archive it.
g
n
bsnow (2022-06-02)
b
Yes, just deployed based off that example. And still getting CORS following by 500 error
g
Can you show the function? My guess is the 500 error is the issue and so maybe Option is not returning. Any errors in the function log on the dashboard?
b
Here is the function, the Logs on the dashboard do show 500 error, but no real information other than headers
g
Your code is not using the CORS function like in the example. You are setting them yourself. Maybe OK, or might be wrong. Have to look more, I've not looked at what the corHeaders function does, but it may just set them like you do.
b
Ok, can I just manually add that _shared folder with cors.ts file? Or is there a specific setup I have to do for that
Just switched to the _shared folder with cors.ts method and now getting cors followed by 400 error.
g
I reported the original cors issue with the edge functions and rolled my own solution, before they came out with the example. I've not tried the example.
b
Ok, any other suggestions or examples? I was looking at https://deno.land/x/cors@v1.2.2 but no good examples on how to use with the supabase edge Fn syntax
g
https://github.com/supabase/functions-js/issues/12 has my hardcoded stuff that works for me. I'm sure the SB example works, so you are probably better off fixing that.
When you get the 400 error any info in the function log?
I used console.log () in the function code when I was debugging and it shows up in the logs.
b
Let me try that and see what I get
this look ok?
g
I think your code at top of function getting the req.json() needs to be in your else statement. The Options call will not have that info. At least in my code I have that part in the non OPTIONS section of the code.
some of my code:
Copy code
if (req.method === 'OPTIONS') {
            return new Response(
                'ok',
                {
                    headers: {
                        "Access-Control-Allow-Origin": "*",
                        "Access-Control-Allow-Methods": "POST",
                        "Access-Control-Expose-Headers": "Content-Length, X-JSON",
                        "Access-Control-Allow-Headers": "apikey,X-Client-Info, Content-Type, Authorization, Accept, Accept-Language, X-Authorization",
                    }
                }
            );
        }
        else {
            const jsonData = await req.json();
            const name = jsonData.name;
            console.log(req.method,req)
            const data = {message: `Hello there ${name}!`};
.......
b
AH that worked! 🙂
Thank you very much