#Requesting `ApiRoute` from react client component
9 messages · Page 1 of 1 (latest)
The request in the Network Tab looks the following
just for reference, this is how my "api" route in that case looks:
export const prerender = false;
import type { APIRoute } from "astro";
export type APIResponse = {
success: boolean;
data: any;
errors: null | any;
};
export const GET: APIRoute = async ({ request, locals }) => {
try {
const API = locals.runtime.env.API;
const url = new URL(request.url);
const baseUrl = `${url.protocol}//${url.hostname}${
url.port ? `:${url.port}` : ""
}/api/v1`;
const response = await API.fetch(`${baseUrl}/events`, {
method: "GET",
});
const data = await response.json();
return new Response(JSON.stringify(data));
} catch (error) {
console.error(error);
return new Response(undefined, { status: 500 });
}
};
If I import the GET function directly in the frontmatter it works perfectly fine
but from the client:
useEffect(() => {
const fetchEvents = async () => {
try {
const response = await fetch("/_proxy/events");
if (!response.ok) throw new Error("Failed to fetch events");
const data = await response.json();
setEvents(data.data);
setLoading(false);
} catch (err) {
setError("Error fetching events");
setLoading(false);
}
};
fetchEvents();
}, []);
this seems to not be working or throw the excpetion actually... but not my exception...
and if I go into the browser and request /_proxy/events directly I also receive the same error. As if the GET is not registered correctly or I am using the APIRoute falsely
just for full reference. the export prerender = false is there because in prod the page is hybrid instead of server (how it is running on our dev environment) - because of our CMS. It's just easier for debugging
ok new advancements.
_proxy seems like a "reserved" etc. keyword.
because if I change it to api-proxy it just started working
is there anyone from the Astro team that could verify my thesis
So _ is ignored in routing.