Even though I've followed the solution provided above for fetching data, I still end up receiving 'undefined' instead of the actual data. Interestingly, when I make the same request using Postman or Thunderclient, it returns a success with status code 200. Can anyone offer some assistance?...
export async function getServerSideProps(context) {
const res = await fetch('http://localhost:5000/api/blogpost/view');
const { data } = await res.json();
return {
props: {
blog: data,
},
}
}
const Page = ({blog}) => {
console.log({ blog: blog, title: "nothing" });
return (
<div><h1>Hello</h3></div>
)}
export default Page;
**I have also attempted to wrap the fetch request inside a try-catch block, but I still encounter the same issue of receiving 'undefined' **
export async function getServerSideProps(context) {
// Fetch data from external API
try {
const res = await fetch('http://localhost:5000/api/blogpost/view');
const { data } = await res.json();
} catch (error) {
console.log(error);
}
console.log(data);
// Pass data to the page via props
return { props: { blog: data } };
}
The console output remains the same as previously received
{ blog: undefined, title: 'nothing' }