HTML 통신과 JSON 통신의 차이

HTML 통신과 JSON 통신의 차이

이번 주 코치님께 코드리뷰를 받고 res.send() 코드에 대해 더 알아보는게 좋겠다는 피드백을 받았다. 그래서 내가 쓴 코드를 보니 res.json과 res.send가 혼용되어 있었던 것
그래서 제대로 알아봤다 !

---

User
    res.status(400).json({ message: error.message });
  }
});

// GET 요청 처리하는 라우터 - 관리자 조회
router.get('/', async (req, res) => {
  const admins = await Admin.find({});
  res.json(admins);
});

// Delete 요청 처리하는 라우터 - 관리자 삭제
router.delete("/:_id", async (req, res) => {
  const { _id } = req.params;
  await Admin.deleteOne({ _id });
  res.send("ok");

일단 결론 먼저.
HTML통신과 JSON 통신에는 데이터를 전송하는 방식에 차이가 존재함

데이터 형식&용도

• HTML 통신은 주로 HTML 문서를 전송 = 웹페이지의 내용 표현 주로 웹 페이지의 내용을 서버에서 클라이언트로 전송하는 데 사용. 따라서 웹 페이지의 구조, 텍스트, 이미지 등을 포함
  
• JSON 통신은 HSON 형식의 데이터를 주고 받는 것을 의미 =주로 웹 애플리케이션에서 데이터를 전송하고 수신하는데 사용 주로 API를 통해 데이터를 요청하고 응답하는 데 사용
  

구조

• HTML통신은 일반적으로 HTML 태그를 사용하여 문서의 구조를 정함 이는 웹 브라우저에서 렌더링되어 사용자에게 표시됨
  
• JSON 통신은 키-값 쌍으로 구성된 데이터 객체를 사용하여 데이터를 표현 JS를 통해 쉽게 파싱할 수 있으며 웹 애플리케이션에서 데이터를 처리하는데 사용됨
  

클라이언트-서버 상호작용

• HTML 통신은 클라이언트가 서버에 HTML 페이지를 요청하고, 서버는 HTML 페이지를 응답
• JSON 통신은 클라이언트가 서버에 데이터를 요청하고 서버는 해당 데이터를 JSON 형식으로 응답하는 방식으로 이루어짐

⇒ 위 라우터는 웹 애플리케이션을 만드는 상황이므로 JSON 통신 사용해야함

res.json() 은 Express에서 클라이언트에게 JSON 형식의 데이터를 보내는 메서드

→ 객체나 배열 등 JavaScript 객체를 JSON 형식으로 변환하여 클라이언트에게 전송

res.send() 는 Express에서 클라이언트에게 다양한 형식의 데이터를 보내는 메서드

→ 주로 HTML, 텍스트, XML 등 다양한 형식의 데이터를 전송할 때 사용

JSON 데이터를 전송할 때 사용하기도 하지만 res.json() 사용하는 것이 일반적으로 좀 더 적합함