pengambilan javascript - Gagal mengeksekusi 'json' pada 'Respon': aliran tubuh dikunci

Ketika status permintaan lebih besar dari 400 (saya telah mencoba 400, 423, 429 negara bagian), pengambilan tidak dapat membaca konten json yang dikembalikan. Kesalahan berikut ini ditampilkan di konsol browser

Tidak tertangkap (dalam janji) TypeError: Gagal mengeksekusi 'json' pada 'Respon': aliran tubuh terkunci

Saya menunjukkan konten objek respons yang dikembalikan sebagai berikut:

Tapi saya masih bisa menggunakannya beberapa bulan yang lalu.

Pertanyaan saya adalah sebagai berikut:

• Apakah ini hanya perilaku browser Chrome atau perubahan standar pengambilan?
• Adakah cara untuk mendapatkan isi tubuh dari keadaan ini?

PS: Versi browser saya adalah Google Chrome 70.0.3538.102 （正式 版本） （64 位）

Saya menemui kesalahan ini juga tetapi ternyata itu tidak terkait dengan status Respon, masalah sebenarnya adalah Anda hanya dapat mengkonsumsi Response.json()sekali, jika Anda mengkonsumsinya lebih dari sekali, kesalahan akan terjadi.

seperti dibawah ini:

    fetch('http://localhost:3000/movies').then(response =>{
    console.log(response);
    if(response.ok){
         console.log(response.json()); //first consume it in console.log
        return response.json(); //then consume it again, the error happens

    }

Jadi solusinya adalah hindari mengkonsumsi Response.json()lebih dari sekali dalam thenblok.

Gunakan Response.clone()untuk mengkloningResponse

contoh

fetch('yourfile.json').then(res=>res.clone().json())

Metode respon seperti 'json', 'teks' dapat dipanggil sekali, dan kemudian terkunci. Gambar tanggapan yang diposting menunjukkan bahwa badan terkunci. Ini berarti Anda telah memanggil 'kemudian', 'menangkap'. Untuk mengatasi ini, Anda dapat mencoba yang berikut ini.

fetch(url)
    .then(response=> response.body.json())
    .then(myJson=> console.log(myJson))

Atau

fetch(url)
    .catch(response=> response.body.json())
    .catch(myJson=> console.log(myJson))

Saya tahu ini sudah terlambat tetapi ini dapat membantu seseorang:

let response = await fetch(targetUrl);
let data = await response.json();

Saya juga terjebak dalam hal ini. Tapi ini berhasil untuk saya.

fetch(YOUR_URL)
.then(res => {
  try {
    if (res.ok) {
      return res.json()
    } else {
      throw new Error(res)
    }
  }
  catch (err) {
    console.log(err.message)
    return WHATEVER_YOU_WANT_TO_RETURN
  }
})
.then (resJson => {
  return resJson.data
})
.catch(err => console.log(err))

semoga berhasil

Saya tidak sengaja menggunakan kembali objek respons, mirip dengan ini:

const response = await new ReleasePresetStore().findAll();
const json = await response.json();
this.setState({ releasePresets: json });

const response2 = await new ReleasePresetStore().findActive();
const json2 = await response.json();
this.setState({ active: json2 });
console.log(json2);

Garis ini:

const json2 = await response.json();

Seharusnya (respon2 bukannya digunakan respon1):

const json2 = await response2.json();

Menggunakan kembali respons sebelumnya tidak masuk akal dan itu adalah kesalahan ketik kode kotor ...

Ini berhasil untuk saya

response.json().then(data => {
  // use data
})

Seperti yang disebutkan dalam pertanyaan ketika Anda mencoba menggunakan objek respons yang sama, tubuh Anda akan segera terkunci karena keadaan objek tersebut. Apa yang dapat Anda lakukan adalah menangkap nilai objek respons dan kemudian mencoba melakukan beberapa operasi padanya (.then ()). Silakan ikuti kode di bawah ini,

fetch('someurl').then(respose) => {
    let somedata = response.json(); // as you will capture the json response, body will not be locked anymore. 
    somedata.then(data) => {
        {
             error handling (if (data.err) { ---- })
        }
        {
             operations (else { ---- })
        }
    } 
}