안녕하세요 코딩애플님. React 강의에 이어서 TS, Next.js 강의까지 잘 듣고 있습니다.
현재 강의에서 진행하는 대로 JS파일을 사용하지 않고, tsx 파일을 사용하여 강의에서 배운 것을 적용하고 있습니다.
게시글 작성 (app/write/page.tsx)에서 POST 요청을 보낼 때, 다음과 같은 에러가 발생하고 있습니다.
Error: Failed to find Server Action "null". This request might be from an older or newer deployment. Original error: Invariant: Missing '
현재, 게시글 작성에서 필요한 파일 정보를 보여드리겠습니다.
1. app/write/page.tsx
import styles from './pages.module.css';
export default function Write() {
return (
<div className={styles['p-20']}>
<h4>게시글 작성</h4>
<form action='/api/post/new' method='POST'>
<input className={styles['input-tag']} name="title" placeholder="작성할 글의 제목을 입력하시오."/>
<input className={styles['input-tag']} name="content" placeholder="작성할 글의 내용을 입력하세요" />
<button className={styles['button']} type='submit'>작성</button>
</form>
</div>
)
}
2. app/pages/api/post/new.tsx
import { connectDB } from '@/src/util/database';
// /api/post/new 요청 시, DB에 글 저장
export default async function handler(req, res) {
console.log(req);
if (req.method == 'POST') {
console.log(req.body);
if (req.body.title == '') {
return res.status(500).json("제목 작성해라");
}
try {
const db = (await connectDB).db('forum')
let result = await db.collection('post').insertOne(req.body);
// console.log(result);
return res.status(200).redirect('/list');
} catch (error) {
console.log(error);
}
}
}
현재 handler 함수가 호출되자마자 콘솔창에 req을 출력해보려고 했는데, 이것조차도 안 되고 있습니다 ㅠㅠ
어떤 부분이 문제인지 전혀 감이 안 잡히네요 허허 도와주세요 ㅠ
