Two terminals are opened, one for Strapi and one for Next.JS. I have set up the configuration in Strapi. I want to receive the API in Next.JS and display it on the screen, but it does not show up. Then I get an error screen. I tested with Postman and confirmed that Get and Post can be done.
I get this error in my browser.
Server Error
Error: connect ECONNREFUSED ::1:1337
This error happened while generating the page. Any console logs will be displayed in the terminal window.
Call Stack
<unknown> (Error: connect ECONNREFUSED
: (1:1337)
TCPConnectWrap.afterConnect [as oncomplete]
node:net (1237:16)
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
wait - compiling...
event - compiled client and server successfully in 393 ms (125 modules)
wait - compiling / (client and server)...
wait - compiling...
event - compiled client and server successfully in 128 ms (144 modules)
wait - compiling /_error (client and server)...
wait - compiling...
event - compiled client and server successfully in 56 ms (145 modules)
error - Error: connect ECONNREFUSED ::1:1337
index.js
import Head from "next/head";
import Image from "next/image";
import styles from "../styles/Home.module.css";
import axios from "axios";
export async function getStaticProps() {
const foodsData = await (
await axios.get("http://localhost:1337/api/foods")
).data.data;
console.log(foodsData);
return {
props: {
foods: foodsData,
},
};
}
export default function Home({ foods }) {
return (
<div className={styles.container}>
<Head>
<title>Create Next App</title>
<meta name="description" content="Generated by create next app" />
<link rel="icon" href="/favicon.ico" />
</Head>
<main className={styles.main}>
<h1 className={styles.title}>Welcome to My Shopping</h1>
<div className={styles.grid}>
{foods.map((food, index) => (
<>
<a
href="https://nextjs.org/docs"
className={styles.card}
key={index}
>
<h2>{food.attributes.title}</h2>
<p>{food.attributes.description}</p>
<div>価格：{food.attributes.price}</div>
</a>
</>
))}
</div>
</main>
</div>
);
}
How can this be corrected? help me plese.
I had this same issue. Change http://localhost:3000 to http://127.0.0.1:1337