Response

Constructor

Response()

Tạo một đối tượng Response mới.

Thuộc tính thể hiện

Response.body Read only

Một ReadableStream chứa nội dung thân phản hồi.

Response.bodyUsed Read only

Lưu một giá trị boolean cho biết phần thân phản hồi đã được dùng hay chưa.

Response.headers Read only

Đối tượng Headers gắn với phản hồi.

Response.ok Read only

Một giá trị boolean cho biết phản hồi có thành công hay không, tức mã trạng thái nằm trong khoảng 200 đến 299.

Response.redirected Read only

Cho biết phản hồi có phải là kết quả của chuyển hướng hay không, tức danh sách URL của nó có nhiều hơn một mục.

Response.status Read only

Mã trạng thái của phản hồi. (Mã thành công sẽ là 200.)

Response.statusText Read only

Thông báo trạng thái tương ứng với mã trạng thái. (Ví dụ: OK cho 200.)

Response.type Read only

Kiểu của phản hồi, ví dụ basic, cors.

Response.url Read only

URL của phản hồi.

Phương thức tĩnh

Response.error()

Trả về một đối tượng Response mới gắn với lỗi mạng.

Response.redirect()

Trả về một phản hồi mới với URL khác.

Response.json()

Trả về một đối tượng Response mới để trả về dữ liệu JSON đã cho.

Phương thức thể hiện

Response.arrayBuffer()

Trả về một promise giải quyết với biểu diễn ArrayBuffer của phần thân phản hồi.

Response.blob()

Trả về một promise giải quyết với biểu diễn Blob của phần thân phản hồi.

Response.bytes()

Trả về một promise giải quyết với biểu diễn Uint8Array của phần thân phản hồi.

Response.clone()

Tạo một bản sao của đối tượng Response.

Response.formData()

Trả về một promise giải quyết với biểu diễn FormData của phần thân phản hồi.

Response.json()

Trả về một promise giải quyết với kết quả phân tích văn bản thân phản hồi dưới dạng JSON.

Response.text()

Trả về một promise giải quyết với biểu diễn văn bản của phần thân phản hồi.

Ví dụ

Tải một hình ảnh

Trong ví dụ fetch cơ bản của chúng tôi (chạy trực tiếp), chúng ta dùng một lời gọi fetch() đơn giản để lấy một hình ảnh và hiển thị nó trong phần tử <img>. Lời gọi fetch() trả về một promise, promise này giải quyết thành đối tượng Response gắn với thao tác tải tài nguyên.

Bạn sẽ thấy rằng vì chúng ta đang yêu cầu một hình ảnh, chúng ta cần chạy Response.blob để phản hồi có đúng kiểu MIME.

const image = document.querySelector(".my-image");
fetch("flowers.jpg")
  .then((response) => {
    if (!response.ok) {
      throw new Error(`HTTP error! status: ${response.status}`);
    }
    return response.blob();
  })
  .then((blob) => {
    const objectURL = URL.createObjectURL(blob);
    image.src = objectURL;
  })
  .catch((error) => {
    console.error("Error fetching the image:", error);
  });

Bạn cũng có thể dùng constructor Response() để tạo đối tượng Response tùy chỉnh của riêng mình:

const response = new Response();

Lời gọi PHP

Ở đây chúng ta gọi một file chương trình PHP tạo ra chuỗi JSON và hiển thị kết quả dưới dạng một giá trị JSON.

// Hàm lấy JSON bằng PHP
const getJSON = async () => {
  // Tạo đối tượng Response
  const response = await fetch("getJSON.php");
  if (response.ok) {
    // Lấy giá trị JSON từ phần thân phản hồi
    return response.json();
  }
  throw new Error("*** PHP file not found");
};

// Gọi hàm và ghi giá trị hoặc thông báo lỗi ra console
getJSON()
  .then((result) => console.log(result))
  .catch((error) => console.error(error));

Thông số kỹ thuật

Tương thích trình duyệt

Xem thêm

• ServiceWorker API
• HTTP access control (CORS)
• HTTP