Tutorial JavaScript Mudah: Cara Mendapatkan Kod Status HTTP

Tutorial JavaScript: Cara mendapatkan kod status HTTP, contoh kod khusus diperlukan

Kata Pengantar:
Dalam pembangunan web, senario interaksi data dengan pelayan sering terlibat. Apabila berkomunikasi dengan pelayan, kami selalunya perlu mendapatkan kod status HTTP yang dikembalikan untuk menentukan sama ada operasi itu berjaya dan melaksanakan pemprosesan yang sepadan berdasarkan kod status yang berbeza. Artikel ini akan mengajar anda cara menggunakan JavaScript untuk mendapatkan kod status HTTP dan menyediakan beberapa contoh kod praktikal.

1. Gunakan objek XMLHttpRequest untuk mendapatkan kod status

XMLHttpRequest ialah objek permintaan HTTP, yang boleh digunakan dalam JavaScript untuk berinteraksi dengan pelayan. Berikut ialah contoh kod untuk mendapatkan kod status HTTP:

let xhr = new XMLHttpRequest();

xhr.open('GET', 'http://example.com/api', true);

xhr.onreadystatechange = function() {
  if (xhr.readyState === XMLHttpRequest.DONE) {
    if (xhr.status === 200) {
      console.log('请求成功');
    } else {
      console.log('请求失败，状态码为：' + xhr.status);
    }
  }
};

xhr.send();

Dalam kod di atas, kami mula-mula mencipta objek XMLHttpRequest, kemudian gunakan kaedah xhr.open untuk menentukan kaedah permintaan dan alamat, dan kemudian lulus Kaedah xhr.onreadystatechange memantau perubahan dalam status permintaan. Apabila xhr.readyState ialah XMLHttpRequest.DONE, permintaan telah selesai. xhr.open方法指定了请求的方式和地址，再通过xhr.onreadystatechange方法监听请求状态的变化。当xhr.readyState为XMLHttpRequest.DONE时，说明请求已完成。

接着，我们通过xhr.status获取到了服务器返回的HTTP状态码。如果状态码等于200，表示请求成功；否则，表示请求失败。

2. 使用Fetch API获取状态码

Fetch API是JavaScript的新特性，提供了更加现代化和强大的与服务器进行数据交互的方式。下面是一个使用Fetch API获取HTTP状态码的示例代码：

fetch('http://example.com/api')
  .then(response => {
    if (response.ok) {
      console.log('请求成功');
    } else {
      console.log('请求失败，状态码为：' + response.status);
    }
  })
  .catch(error => {
    console.log('请求发生错误：', error);
  });

在以上代码中，我们使用了Fetch API的fetch函数发起了一个GET请求。然后通过.then方法处理服务器的响应结果。如果response.ok为true，表示请求成功；否则，表示请求失败。可以通过response.status获取到HTTP状态码。

此外，我们还可以使用.catch

Seterusnya, kami memperoleh kod status HTTP yang dikembalikan oleh pelayan melalui xhr.status. Jika kod status bersamaan dengan 200, permintaan itu berjaya jika tidak, permintaan itu gagal.

2. Gunakan Fetch API untuk mendapatkan kod status

Fetch API ialah ciri baharu JavaScript yang menyediakan cara yang lebih moden dan berkuasa untuk berinteraksi dengan pelayan. Berikut ialah contoh kod yang menggunakan API Ambil untuk mendapatkan kod status HTTP:

if (xhr.status === 301) {
  console.log('请求被永久重定向');
}

Dalam kod di atas, kami menggunakan fungsi fetch Fetch API untuk memulakan permintaan GET. Kemudian proseskan hasil respons pelayan melalui kaedah .then. Jika response.ok adalah true, ini bermakna permintaan itu berjaya jika tidak, ini bermakna permintaan itu gagal. Kod status HTTP boleh diperolehi melalui response.status.
Selain itu, kami juga boleh menggunakan kaedah .catch untuk menangkap ralat semasa proses permintaan.
• Contoh pemprosesan kod status HTTP biasa yang lain
Selain 200, kod status HTTP mempunyai banyak nilai lain dan setiap nilai mewakili makna yang berbeza. Berikut ialah beberapa contoh pengendalian kod status HTTP biasa:
301 Ubah hala kekal:

• if (xhr.status === 404) {
    console.log('请求的页面不存在');
  }

404 Halaman tidak ditemui:

if (xhr.status === 500) {
  console.log('服务器发生错误');
}


500 Ralat pelayan:

🎜🎜🎜3:

if (xhr.status === 503) {
  console.log('服务当前不可用');
}

tidak tersedia 🎜rrreee🎜Oleh mengendalikan kod status yang berbeza dengan sewajarnya, anda boleh menangani situasi ralat yang berbeza dengan lebih baik. 🎜🎜Kesimpulan: 🎜Artikel ini memperkenalkan cara menggunakan JavaScript untuk mendapatkan kod status HTTP dan menyediakan beberapa contoh kod khusus. Dengan menguasai pengetahuan ini, anda akan dapat menangani ralat dengan lebih baik semasa interaksi dengan pelayan dan meningkatkan kecekapan pembangunan web. Semoga artikel ini dapat membantu anda! 🎜

Atas ialah kandungan terperinci Tutorial JavaScript Mudah: Cara Mendapatkan Kod Status HTTP. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!