현재 버전

next.js 와 node.js 서버 연동 왜 안될까요 ㅜㅜ

next.js 는 localhost:3000 이고

node.js 서버는 localhost:5000입니다

프론트엔드

next.config.js 코드

module.exports = {
  async rewrites(){
    return [
      {
        source: '/api/:slug*',
        destination: `http://localhost:5000/api/:slug*`,
      },
    ]
  }
}


백엔드 코드

const express = require('express')
const app = express()
const port = 5000

app.get('/test', (req, res) => {
  res.json({hi:'Hello World!'});
})

app.listen(port, () => {
  console.log(`Example app listening at http://localhost:${port}`)
})


nextjs의 컴포넌트에서 버튼을 누르면 axios로 아래와같이 get 요청을 보냅니다

  const onClick = useCallback(()=>{
    axios.get('/api/test');

근데 에러가 나요 ㅜㅜ

뭐가 잘못된걸까여 ㅠㅠ


프론트, 백엔드 서버 둘다 켰어요 

수정 이력

2021-11-05 16:05:46 에 아래 내용에서 변경 됨 #2

next.js 는 localhost:3000 이고

node.js 서버는 localhost:5000입니다

프론트엔드

next.config.js 코드

module.exports = {
  async rewrites(){
    return [
      {
        source: '/api/:slug*',
        destination: `http://localhost:5000/api/:slug*`,
      },
    ]
  }
}


백엔드 코드

const express = require('express')
const app = express()
const port = 5000

app.get('/test', (req, res) => {
  res.json({hi:'Hello World!'});
})

app.listen(port, () => {
  console.log(`Example app listening at http://localhost:${port}`)
})


nextjs의 컴포넌트에서 버튼을 누르면 axios로 아래와같이 get 요청을 보냅니다

  const onClick = useCallback(()=>{
    axios.get('/api/test');

근데 에러가 나요 ㅜㅜ

뭐가 잘못된걸까여 ㅠㅠ


2021-11-05 16:02:31 에 아래 내용에서 변경 됨 #1

next.js 는 localhost:3000 이고

node.js 서버는 localhost:5000입니다

프론트엔드

next.config.js 코드

module.exports = {
  async rewrites(){
    return [
      {
        source: '/api/:slug*',
        destination: `http://localhost:5000/api/:slug*`,
      },
    ]
  }
}


백엔드 코드

const express = require('express')
const app = express()
const port = 5000

app.get('/test', (req, res) => {
  res.json({hi:'Hello World!'});
})

app.listen(port, () => {
  console.log(`Example app listening at http://localhost:${port}`)
})


nextjs의 컴포넌트에서 버튼을 누르면 axios로 아래와같이 get 요청을 보냅니다

  const onClick = useCallback(()=>{
    axios.get('/api/test');

근데 에러가 나요 ㅜㅜ

뭐가 잘못된걸까여 ㅠㅠ