XMLHttpRequest による通信デモ

JavaScript コード

  const request = new XMLHttpRequest();

  request.open("GET", url, true);

  request.onload = async () => {


    const contentType = request.getResponseHeader("Content-Type");

    log(`→ response.status: ${request.status}`);

    log(`→ Content-Type: ${request.getResponseHeader("Content-Type")}`);


    const profile = JSON.parse(request.responseText);

    displayUserProfile(profile);

  };


  request.onerror = async (event) => {

    await sleep(ms);


    if (errorType === "status") {

      log("エラー発生: HTTPステータスエラー");


    } else if (errorType === "invalidjson") {

      log("エラー発生: JSON形式ではないレスポンス");


    } else {

      log("エラー発生: 通信に失敗しました（ネットワーク不通など）");

    }

  };


  request.onloadend = async () => {

    log("通信処理完了");

  };


  request.send();

  

PHP コード（user_profile.php）

<?php

sleep(5);




if (isset($_GET['raw'])) {

  header('Content-Type: text/plain');

  echo "これはJSONではありません";

  exit;

}




header('Content-Type: application/json');

echo json_encode([

  "name" => "増田健人",

  "email" => "masuda@example.com",

  "age" => 28

]);

?>