I'm having trouble displaying the output of an API call using console.log. The issue is that nothing appears in the console (both in the browser and Visual Studio Code).
The only console.log that seems to work is within the RouteStatus function, but it shows undefined as a result.
Here's the code snippet:
import RefreshButton from "./refreshButton";
import { getHealthStatus } from "@/lib/health";
export async function getStaticProps() {
const health = await getHealthStatus()
console.log(health) // Issue
console.log({health}) // Issue
console.log("test"); // Issue
return {
props: {
health
},
};
}
export default function RouteStatus({ health }) {
console.log(health) // Works but shows undefined
console.log({health}) // Works but shows undefined
console.log("test"); // Works
return (
<>
</>
)
}
The getHealthStatus function looks like this:
export async function getHealthStatus() {
// Fetch data from an external API endpoint
const res = await
fetch('https://example.net:8080/healthcheck')
if (!res.ok) throw new Error('failed to fetch data')
console.log(res.json()) // Issue
return res.json();
}
Is there a way to make it work properly? I'm attempting to show variables in the console and expect to see the results displayed.