4:18 22번라인 1) .then((res) => res.json()) .then((res) => console.log(res)); 위 코드와 2) .then((res) => { res.json(); }).then((res) = > console.log(res)); 브라우저 콘솔에 출력 되는 결과값이 다른데 이유가 뭔가요? 1) 코드는 영상과 같은 결과값이 출력이 되는데, 2) 코드는 undefined가 출력이 됩니다.
우리밋님 강의 잘 듣고 있습니다. 혹시 fetch 두 번째 인자로 전달된 객체의 body 키와 첫 번째 then 에서 반환되는 res , 즉 리스폰스 객체의 바디 믹스인은 같은 것인가요? body 문서를 찾아보니까 http request와 http response 객체에 둘 다 구현이 되어 있다고 나와서요. 실제로 콘솔로 res를 찍어보니까 body 키가 있더라구요! 그래서 혹시나 저희가 두 번째 인자로 전달한 객체의 형태도 서버로 부터 응답되는 response 객체의 형태와 같게 전달한 건가 싶어서요!
음… 제가 이해를 잘 못하는것인지 조금 어렵네요 ㅜ “fetch의 두번째 인자로 넘기는 객체의 body를 서버에서 req.body로 받는 게 맞느냐”라는 질문인건가요? ㅜㅜ 아는 만큼 보인다고 하는데 제가 모르는 내용일지도 모르겠네요.. 음.. 꽤나 깊게 알고있다고 생각하는데 아닌가봅니다 ㅜ 질문이 이해가 안가는거보면…악 ㅎㅎ
@@woorimit 아 우리밋님! 답변 정말 감사드려요! 제가 질문드렸을 때는 http 요청 응답 구조에 대해서 잘 몰라서 해당 내용을 좀더 공부하고 fetch랑 fetch가 반환하는 promise 객체를 좀 더 공부하고 나니까 말끔히 해결된 것 같습니다! 백엔드 입문하려고 하는 입장에서 영상 따라가면서, 많이 배우고 있습니다! 모르는 내용은 다시 돌아가서 찾아보면서 하니까 더욱 좋은 것 같아요. 감사합니다 :)
안녕하세요 너무 좋은 강의감사합니다. 아무리 찾아도 안나와서 여기까지 오게된 사람인데요. 대충 게임툴 비슷한 웹 샘플로 만들어보는데, NodeJs로 서버키고 프론트엔트에서 fetch()로 GET으로 읽어오는 거 말고(GET은 잘되는데) PUT이용해서 기존에 있던 Json파일 데이터를 변경및 쓰기를 하고 싶은데 분명 경로 잘 입력했는데도 404 no Found 에러만 뜨는데 강의의 app.post()처럼 put에 관련된 미들웨어인가 그것도 준비해야 되는건가요? 서버 너무 어려워요 ㅜㅜㅜㅜ
항상 잘 듣고있습니다. 제가 .then((res) =? console.log(.json()));을 작성 한뒤로 계속 Failed to load resource: net::ERR_NAME_NOT_RESOLVED5 Uncaught (in promise) TypeError: Failed to fetch이러한 오류라 브라우저 콘솔에 찍히는데 왜 그런건가요?
.json() 도 res.json()으로 해주어야합니다. 또한, 화살표함수를 한 줄로 사용할 때는 “() => 반환값”과 같은 형태로 사용됩니다. 콘솔로그는 반환하는 값이 undefined여서 그 다음 이어지는 .then() 메서드를 실행할 때 오류가 발생하게됩니다. (res) => res.json() 이렇게 작성하시면 될거예요^^
![[Node.js] 백엔드 맛보기 | 서버의 응답데이터 처리 in 프런트](http://i.ytimg.com/vi/bIcvoDis-vU/mqdefault.jpg)
![[Node.js] 백엔드 맛보기 | 서버의 응답데이터 처리 in 프런트](/img/tr.png)
![[Node.js] 백엔드 맛보기 | AWS RDS로 DB 구축하기 | 로그인 구현 | MySQL](/img/1.gif)
모듈화 하면서 하니까 정리 되면서 머리속에 잘 저장되어 편안하고 너무 재미 있어요~ 강의 감사합니다
2023 08 03
fetch({신호 경로}, {전송 대상}).then({리턴값} => {함수})의 형태로써, 리턴이 True면 로그인 진행, False면 로그인 차단으로 로직이 구현됨.
4:18
22번라인
1)
.then((res) => res.json())
.then((res) => console.log(res));
위 코드와
2)
.then((res) => {
res.json();
}).then((res) = > console.log(res));
브라우저 콘솔에 출력 되는 결과값이 다른데
이유가 뭔가요?
1) 코드는 영상과 같은 결과값이 출력이 되는데,
2) 코드는 undefined가 출력이 됩니다.
화살표 함수를 한 줄로 짤 때는 => 다음에 오는 값이 반환값이 됩니다!
2번을 1번과 같이 짜려면
.then((res) => {
return res.json();
})
.then()
으로 해주면 됩니다^^
우리밋님 강의 잘 듣고 있습니다. 혹시 fetch 두 번째 인자로 전달된 객체의 body 키와 첫 번째 then 에서 반환되는 res , 즉 리스폰스 객체의 바디 믹스인은 같은 것인가요? body 문서를 찾아보니까 http request와 http response 객체에 둘 다 구현이 되어 있다고 나와서요. 실제로 콘솔로 res를 찍어보니까 body 키가 있더라구요! 그래서 혹시나 저희가 두 번째 인자로 전달한 객체의 형태도 서버로 부터 응답되는 response 객체의 형태와 같게 전달한 건가 싶어서요!
음… 제가 이해를 잘 못하는것인지 조금 어렵네요 ㅜ
“fetch의 두번째 인자로 넘기는 객체의 body를 서버에서 req.body로 받는 게 맞느냐”라는 질문인건가요? ㅜㅜ
아는 만큼 보인다고 하는데 제가 모르는 내용일지도 모르겠네요.. 음.. 꽤나 깊게 알고있다고 생각하는데 아닌가봅니다 ㅜ 질문이 이해가 안가는거보면…악 ㅎㅎ
@@woorimit 아 우리밋님! 답변 정말 감사드려요! 제가 질문드렸을 때는 http 요청 응답 구조에 대해서 잘 몰라서 해당 내용을 좀더 공부하고 fetch랑 fetch가 반환하는 promise 객체를 좀 더 공부하고 나니까 말끔히 해결된 것 같습니다!
백엔드 입문하려고 하는 입장에서 영상 따라가면서, 많이 배우고 있습니다! 모르는 내용은 다시 돌아가서 찾아보면서 하니까 더욱 좋은 것 같아요. 감사합니다 :)
[nodemon] app crashed - waiting for file changes before starting..
npm start 명령어를 치면 나오는 오류인데 구글링해도 해결이되지않는데 방법이있을까요 ㅠㅠ
에러 로그 전체를 복사 붙여넣기 해주시면 문제 해결에 도움 드릴 수 있을 것 같아요 ㅎㅎ
아니면 블로그나 노션 등에 사진이랑 같이 올리셔서 링크를 보내주셔도 좋을 것 같네요~~
@@woorimit 해결 했습니다 ㅎㅎ 오타였는데 => 이거를 빠트렷네요 ㅎㅎㅎ
여기서부터 이해가 잘 안가네요 ㅠㅠ 영상 감사합니다!
이해가 어려울 수 있는 부분이니 혹시나 좌절하진 마시구요^^ 좋은 댓글 감사합니다 코드님 홧팅!🔥
안녕하세요 너무 좋은 강의감사합니다. 아무리 찾아도 안나와서 여기까지 오게된 사람인데요.
대충 게임툴 비슷한 웹 샘플로 만들어보는데,
NodeJs로 서버키고 프론트엔트에서 fetch()로 GET으로 읽어오는 거 말고(GET은 잘되는데)
PUT이용해서 기존에 있던 Json파일 데이터를 변경및 쓰기를 하고 싶은데 분명 경로 잘 입력했는데도 404 no Found 에러만 뜨는데
강의의 app.post()처럼 put에 관련된 미들웨어인가 그것도 준비해야 되는건가요? 서버 너무 어려워요 ㅜㅜㅜㅜ
도움이 된다니 다행이네요. 404 HTTP 상태코드는 리소스가 없다는 것을 의미합니다. 즉, 프런트에서 요청한 PUT API가 서버에 존재하지 않다는 의미겠죠~ Put에 해당하는 API를 서버에서 만들어주면 됩니다 ^^
말씀하신것처럼 app.put()으로 미들웨어 추가해주시면 돼요^^
@@woorimit 와빠른답변감사합니다 오늘부터정주행할게요
항상 잘 듣고있습니다. 제가 .then((res) =? console.log(.json()));을 작성 한뒤로 계속 Failed to load resource: net::ERR_NAME_NOT_RESOLVED5
Uncaught (in promise) TypeError: Failed to fetch이러한 오류라 브라우저 콘솔에 찍히는데 왜 그런건가요?
댓글에 오타내신거같은데
.then((res) =?
물음표 오타시죠?
.json() 도 res.json()으로 해주어야합니다.
또한, 화살표함수를 한 줄로 사용할 때는 “() => 반환값”과 같은 형태로 사용됩니다.
콘솔로그는 반환하는 값이 undefined여서 그 다음 이어지는 .then() 메서드를 실행할 때 오류가 발생하게됩니다.
(res) => res.json()
이렇게 작성하시면 될거예요^^
@@woorimit 아닙니다 코드에는 =>로 써있는데 댓글 작성하면서 ?로 쳐진거같네요
@@woorimit .then((res) => console.log(res.json())); 이렇게 바꿧는데도 같은 오류메세지가 나옵니다ㅠㅠ
@@wons4724 앗 콘솔로그를 빼야해요 ㅎㅎ
콘솔로그가 반환하는 값이 undefined에요!