RestApi 반환 값 자바스크립트에서 처리를 어떻게 해야되나요??

프런트단에서 어떻게 API에서 내려준 response를 받는지에 대한 질문을 주셨는데 프런트 단에 대한 내용이 없어서 답변을 주기가 쉽진 않지만 일반적으로 javascript(jquery)를 사용해서 response를 받을 때 예시를 드리겠습니다. $.ajax({ type: "POST", url: 게시글 작성 API , data: 게시글 데이터, success: function(response) { //성공 했을 때 const res= JSON.parse(response); console.log(res); }, error: function(xhr, status, error) { //실패 했을 때 console.error(error); } }); success에서 console을 찍어서 내려 받은 response가 어떤 형태 인지를 직접 보고 활용하시면 됩니다.

REST API를 호출한 결과는 다양한 형식으로 반환될 수 있습니다. 대표적으로는 JSON, XML 등이 있습니다. 여기서는 JSON 형태로 반환하는 것을 가정하고 답변을 드리겠습니다. 자바스크립트에서 REST API 호출 후 JSON 형태의 응답을 처리하기 위해서는 XMLHttpRequest 객체를 사용하거나, fetch API를 사용하는 방법이 있습니다. 1. XMLHttpRequest를 사용하는 방법은 아래와 같습니다. 이 코드에서는 POST 메서드로 /api/post 경로에 JSON 형태의 데이터를 전송합니다. 응답으로 JSON 형태의 데이터를 받아와서 파싱하여 처리합니다. 2. fetch API를 사용하는 방법은 아래와 같습니다. 이 코드에서는 fetch 함수를 사용하여 POST 메서드로 /api/post 경로에 JSON 형태의 데이터를 전송합니다. 응답으로 JSON 형태의 데이터를 받아와서 처리합니다. 3. 반환된 JSON 데이터는 객체 형태로 사용할 수 있습니다. 예를 들어, 게시글 객체의 속성 중에서 title 속성값을 출력하고자 할 경우 아래와 같이 사용할 수 있습니다. 더 자세한 내용은 MDN 웹 문서에서 확인할 수 있습니다. XMLHttpRequest Fetch API

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
#1
const xhr = new XMLHttpRequest();
xhr.open('POST', '/api/post', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onreadystatechange = function() {
  if (xhr.readyState === 4 && xhr.status === 200) {
    const post = JSON.parse(xhr.responseText);
    console.log(post);
  }
}
xhr.send(JSON.stringify({ title: '제목', content: '내용' }));

#2
fetch('/api/post', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ title: '제목', content: '내용' })
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error));

#3
const title = post.title;
console.log(title);