본문 바로가기

오류해결

[프론트 설정/ 백엔드 설정 express.urlencoded true, express.json] TypeError: Cannot read properties of undefined

 

 

프론트에서 정보를 보내는데 못받아오는 오류가 생겼다. 

 

 

TypeError: Cannot read properties of undefined (reading 'email')

 

 

body의 내용을 못 읽어 와서였다.

 

 

 

 

 


일단 프론트쪽 설정

 

1. 프론트에서 정보를 받아올때 from에 꼭 method="post"로 설정을 해 두어야지 된다고 들었어서,

프론트엔드 쪽에 문제는 아닌듯 했다. 

 

 

2. 그리고 input은 꼭 name을 붙여주어야 한다고 해서 name을 붙여둔 상태. 

 

 

 

 

 

 ****** 백엔드와 프론트엔드에서 이어주는 부분이 바로 name이다. ******

 

 

 

만약 프론트 name과 백엔드에서 받아오는 명칭이 다를경우 

 

 

이름이 다른 부분은 undefined로 내용을 읽어오지 못한다.

 

 

 

 


백엔드 설정: 아래 코드 입력해주기

app.use(express.urlencoded({ extended: true }));
app.use(express.json());

 

 

 

 

 

프론트에서 문제가 없다면, 백엔드로 넘어올때 읽어오지 못한다는 소리.

 

 

읽어오는 방식을 설정해 주었다.

 

 

 

 

 

urlencoded 쓰는 이유:

express에서 input value를 읽어올때 꼭 필요함.

 

 

 

본문 데이터가 URL-encoded 형식의 "문자열"로 넘어옴 => 객체로 변환이 필요

 

 

프론트엔드 본문의 내용을 ==> req.body로 받아올수 있게 해주는 것. (프론트와 백엔드의 해석기 같은 느낌인듯)

 

extended: true - 모든 유형 허용

 

참고: https://reload1bronze.tistory.com/252

https://stackoverflow.com/questions/55558402/what-is-the-meaning-of-bodyparser-urlencoded-extended-true-and-bodypar

 

 


결론:

프론트엔드에서 from method=post로 설정하기

input에서 name 과 백엔드에서 받아오는 이름을 일치시켜주기

 

 

백엔드에서

app.use(express.urlencoded({ extended: true }));

추가해주기.