28Jan2020 TIL

Body.json()

:When the fetch is successful, we read and parse the data using json(), then read values out of the resulting objects as you'd expect and insert them into list items to display our product data. (출처 : mdn)

 

 fetch(server, {
        method: "GET",
        headers: {
          "Content-Type": "application/json"
        }
      })
      .then(res => res.json())
      .then(json => {
        app.data = json;
        return callback !== undefined ? callback(json) : null;
      });

서버로 부터 성공적으로 불러온 데이터를 우리가 읽고 가공할 수 있는 parse 된 데이터 형식으로 변환 시켜준다.

 

Body.text()

:The text() method of the Body mixin takes a Response stream and reads it to completion. It returns a promise that resolves with a USVString object (text). The response is always decoded using UTF-8. (출처 : mdn)

    var myHeaders = new Headers();
    myHeaders.append("Content-Type", "application/json");

    var requestOptions = {
      method: "POST",
      headers: myHeaders,
      body: JSON.stringify(messages),
      redirect: "follow"
    };

    window
      .fetch(app.server, requestOptions)
      .then(response => response.text())
      .then(result => console.log(result))
      .catch(error => console.log("error", error))

---

body.json() 과 text() 의 차이는 뭘까..? 

---

Chatter 만들기 

 

 

twittler 와 마찬가지로, 하나의 기능을 구현하기 위해선 각 단계를 아주 세밀하게 나누어 순서에 맞게 진행해야 한다. 2주 넘게 chatter 의 늪에 빠져 허우적대고 있다가 드디어 대략적으로 원하는 기능을 구현했다. fetch가 뭔지도 제대로 이해를 못하는 상황에서 내가 원하는 기능을 구현하기 위해 api에서 받은 정보를 적절하게 가공하는 일이 어려웠다. 내일은 sos 문서를 보며, 모르는 것들을 블로그에 정리해보아야겠다.