nearhanfarhan
nearhanfarhan

Reputation: 1

Calling Eventbrite API using Supabase edge function - why might a POST request give GET responses to endpoint

I'm using Supabase edge functions to make API calls to the Eventbrite API due to CORS constraints preventing me making the call from the client side of my React project.

I'm trying to call the create venue endpoint: https://www.eventbrite.com/platform/api#/reference/venue/retrieve/create-a-venue

My API call to the supabase edge function:

export const createVenue = async (organizationId, venueData) => {
  console.log(venueData)
  const { data, error } = await supabase.functions.invoke("createVenue", {
    body: JSON.stringify({ organizationId, venueData }),
  });

  if (error) {
    console.error("Error creating venue:", error.message);
  } else {
    console.log(data)
    return data;
  }
};

console.log(venueData) looks like this:

{
    "name": "ASDF, Jalan Boulevard Bukit Gading Raya, West Kelapa Gading, North Jakarta City, Jakarta, Indonesia"
}

in my supabase function "createVenue":

const corsHeaders = {
  "Access-Control-Allow-Origin": "*",
  "Access-Control-Allow-Headers":
    "authorization, x-client-info, apikey, content-type",
};

Deno.serve(async (req) => {
  // This is needed if you're planning to invoke your function from a browser.
  if (req.method === "OPTIONS") {
    return new Response("ok", { headers: corsHeaders });
  }


  const eventbriteApiKey = API_KEY;

  if (!eventbriteApiKey) {
    return new Response("Unauthorized, no Eventbrite Key", { status: 401 });
  }

  try {
    const { organizationId, venueData } = await req.json();

    const response = await fetch(
      `https://www.eventbriteapi.com/v3/organizations/${organizationId}/venues`,
      {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
          Authorization: `Bearer ${eventbriteApiKey}`,
        },
        body: JSON.stringify({ venue: venueData }),
      }
    );

    console.log(response);

    
    if (!response.ok) {
      const responseBody = await response.json();
      return new Response(JSON.stringify(responseBody), {
        status: response.status,
        headers: { ...corsHeaders, "Content-Type": "application/json" },
      });
    }

    const responseBody = await response.json();
    console.log(responseBody);
    return new Response(JSON.stringify({ success: true }), {
      status: 200,
      headers: { ...corsHeaders, "Content-Type": "application/json" },
    });
  } catch (error) {
    return new Response(JSON.stringify({ error: error.message }), {
      status: 500,
      headers: { ...corsHeaders, "Content-Type": "application/json" },
    });
  }
});

console.log(response) looks like this:

[Info] Response {
  body: ReadableStream { locked: false },
  bodyUsed: false,
  headers: Headers {
    "access-control-allow-headers": "Authorization, Content-Type, Eventbrite-API-Waypoint-Token, Eventbrite-API-Deprecated-Features",
    "access-control-allow-origin": "*",
    "access-control-max-age": "600",
    allow: "GET, POST, HEAD, OPTIONS",
    "cache-control": "no-cache, no-store, must-revalidate, max-age=0",
    "content-type": "application/json",
    date: "Wed, 17 Apr 2024 14:15:30 GMT",
    expires: "0",
    p3p: 'CP="NOI ADM DEV PSAi COM NAV OUR OTRo STP IND DEM"',
    pragma: "no-cache",
    "referrer-policy": "strict-origin-when-cross-origin",
    server: "nginx",
    "set-cookie": "SP=AGQgbbl6qd1m811dNVQvjQkxk9V2aVOzb0qIZvcbnvPqSlZjeK3ZHzzXcZifRXQbC5J22iGo7WnKDJevm1FH6y3hxJ1OSDR_2"... 203 more characters,
    "strict-transport-security": "max-age=63072000; includeSubDomains; preload",
    vary: "Accept, Accept-Encoding",
    via: "1.1 73d28c256395ed91a9d3be64df71b870.cloudfront.net (CloudFront)",
    "x-amz-cf-id": "1vyyFmTlKPBs2QpmqN7ietkCwVn9PN2flu4C0NMu7N9cZcATqAKrNw==",
    "x-amz-cf-pop": "LHR61-C2",
    "x-cache": "Miss from cloudfront",
    "x-content-type-options": "nosniff",
    "x-frame-options": "SAMEORIGIN",
    "x-permitted-cross-domain-policies": "none",
    "x-rate-limit": "token:YI6KCWOBC4XOFC4SR3AK 51/2000 reset=2005s, key:D7Q7SOHHV7QLPT57YS 51/2000 reset=2005s",
    "x-ua-compatible": "IE=edge",
    "x-xss-protection": "1; mode=block"
  },
  ok: true,
  redirected: true,
  status: 200,
  statusText: "OK",
  url: "https://www.eventbriteapi.com/v3/organizations/2069088507983/venues/"
}

console.log(responseBody) looks like this:

[Info] {
  pagination: {
    object_count: 3,
    continuation: null,
    page_count: 1,
    page_size: 50,
    has_more_items: false,
    page_number: 1
  },
  venues: [
    {
      address: {
        address_1: "55 Dalston Lane",
        address_2: "",
        city: "London",
        region: "England",
        postal_code: "E8 2NG",
        country: "GB",
        latitude: "51.54646019999999",
        longitude: "-0.07060709999999999",
        localized_address_display: "55 Dalston Lane, London, E8 2NG",
        localized_area_display: "London",
        localized_multi_line_address_display: [ "55 Dalston Lane", "London", "E8 2NG" ]
      },
      resource_uri: "https://www.eventbriteapi.com/v3/venues/204818779/",
      id: "204818779",
      age_restriction: null,
      capacity: null,
      name: "Allpress Espresso Roastery and Cafe",
      latitude: "51.54646019999999",
      longitude: "-0.07060709999999999"
    },
    {
      address: null,
      resource_uri: "https://www.eventbriteapi.com/v3/venues/208602839/",
      id: "208602839",
      age_restriction: null,
      capacity: 100,
      name: "Great Venue",
      latitude: null,
      longitude: null
    },
    {
      address: {
        address_1: null,
        address_2: "",
        city: null,
        region: "",
        postal_code: null,
        country: null,
        latitude: "51.402869",
        longitude: "-0.166709",
        localized_address_display: null,
        localized_area_display: null,
        localized_multi_line_address_display: []
      },
      resource_uri: "https://www.eventbriteapi.com/v3/venues/209012849/",
      id: "209012849",
      age_restriction: null,
      capacity: null,
      name: "Mitcham, UK",
      latitude: "51.402869",
      longitude: "-0.166709"
    }
  ]
}

which is the result of a GET request to the endpoint, not a POST request.

I am really at a loss of why this is happening, as I am specifying a POST request in my API call in the edge function.

I expected a POST request to be made to the endpoint in the Supabase edge function, however the returned data is of a GET request

Upvotes: 0

Views: 95

Answers (1)

nearhanfarhan
nearhanfarhan

Reputation: 1

Solved it: I was missing a trailing "/" in my api url.

fetch() doing GET instead of POST on react-native (iOS)

Upvotes: 0

Related Questions