web-dev-qa-db-ja.com

JavaScript Fetch API-出力をオブジェクト（Promiseではない）として変数に保存する方法

フェッチの出力を変数に保存するにはどうすればよいですか？オブジェクトと同じように操作できますか？

これがコードです：

_var obj;
fetch("url", {
  method: "POST",
  body: JSON.stringify({
    "filterParameters": {
      "id": 12345678
    }
  }),
  headers: {"content-type": "application/json"},
  //credentials: 'include'
})
.then(res => res.json())
.then(console.log)
_

最後の_console.log_はオブジェクトを表示します。しかし、変数.then(res => obj = res.json())に保存しようとしたとき、console.log(obj)はオブジェクトを保持せず、約束を保持します。

Console

それを変数に保存されたオブジェクトに変換する方法はありますか？

javascriptfetch-api
11
Vlasta Po

.json() は非同期メソッド（Promise自体を返す）なので、次の.then()で解析済みの値を割り当てる必要があります

var obj;

fetch('https://jsonplaceholder.typicode.com/posts/1')
  .then(res => res.json())
  .then(data => obj = data)
  .then(() => console.log(obj))
20
yuriy636

変数に格納する代わりに、データを返す関数を作成し、それを変数に格納します。

 async fetchExam(id) {
    try {
        const response = await fetch(`/api/exams/${id}`, {
            method: 'GET',
            credentials: 'same-Origin'
        });
        const exam = await response.json();
        return exam;
    } catch (error) {
        console.error(error);
    }
}

次に、その関数を呼び出してデータを取得します

 async renderExam(id) {
    const exam = await fetchExam(id);
    console.log(exam);
}
0
Prathamesh More