基本情報技術者 2019年 春期 午前（科目A） 問50

Ajaxによる非同期通信【午前解説】

正解の理由

解法ステップ

1. 問題文のキーワード（非同期通信、画面全体の遷移を伴わない、動的ユーザインタフェース）を抽出する。
2. 各選択肢がそのキーワードに合致するかを検証する（技術的役割を思い出す）。
3. 非同期にサーバと通信して部分更新を行う技術を選ぶ → Ajax を選択する。

選択肢別の誤答解説

• ア: Ajax — 正解。非同期通信でデータを取得してDOMを更新し、画面遷移なしに動的UIを実現する技術の総称です。
• イ: CSS — 誤り。CSS はスタイルシート言語であり、サーバとの非同期通信やデータ取得機能は持ちません。見た目を変更することはできても、それ自体で動的コンテンツを取得する手段ではありません。
• ウ: RSS — 誤り。RSS はウェブフィードの配信フォーマットで、コンテンツ配信の仕組みを指しますが、ブラウザ上で部分更新を行う非同期通信の技術ではありません。
• エ: SNS — 誤り。SNS（ソーシャル・ネットワーキング・サービス）はサービスの分類であり、特定の非同期通信技術を指す語ではありません。

よくある誤解

• 「Ajax = XMLHttpRequest だけ」と考える誤解：XHR は歴史的な手段で、現在は Fetch API や Promise ベースの実装も含めて Ajax 的な処理とみなされます。
• 「見た目（CSS）が動的になる＝Ajax」と混同する誤解：CSS はスタイル指定であり、サーバとの非同期通信やデータ取得は行えません。
• 「RSSやSNSが非同期で画面更新を行う技術だ」とする誤認：RSS は配信フォーマット、SNS はサービスの種類であり、いずれも技術的手法そのものではありません。

補足コラム

// Fetch API でサーバからJSONを取得して部分更新する例
fetch('/api/data')
  .then(response => response.json())
  .then(data => {
    document.getElementById('result').textContent = data.message;
  })
  .catch(err => console.error('通信エラー', err));

FAQ