1分でわかるシリーズ Ajax DOM JSON XML XMLHttpRequest 技術

【1分でわかるAjax(概念編)】

投稿日:

今回はAjaxの概念について解説していきます。

淡々とした説明になっていますが、重要なのでお読みください。わからないことある方はプログラミングカウンセリングサービス「ギクサポ」まで!



Ajaxとは

よく聞く機会はあるけど、初心者には理解しがたい概念であるAjaxAjaxとは一体何なのでしょうか。

Wikipadiaの定義によると、「Ajax(エイジャックス、アジャックス)は、ウェブブラウザ内で非同期通信を行いながらインターフェイスの構築を行うプログラミング手法である。XMLHttpRequestHTTP通信を行うためのJavascript組み込みクラス)による非同期通信を利用し、通信結果に応じてダイナミックHTML(DHTML) で動的にページの一部を書き換えるというアプローチを取る。」とあります。(参照:https://ja.wikipedia.org/wiki/Ajax

Ajaxとは「Asynchronous JavaScript + XML」の略であり、Asynchronousとは、非同時性の、非同期のという意味なので、Ajaxとはすなわち「JavaScriptとXMLを使って非同期にサーバとの間の通信を行うこと。」です。



そもそも非同期通信とは何か?

 

このように画像がいちいち遷移することがない通信を非同期通信と言います。

同期処理は、画面がいちいち切り替わる処理のことを言います。

また、Twitterのいいね機能にもいいねする度に画面が切り替わることがないと思いますが、あれにもAjaxの仕組みが適応されています

こういったユーザーフレンドリーなUIを提供するためにはAjaxという仕組みが必要です。



同期通信と非同期通信の違い


・同期通信

webブラウザからサーバーにリクエストを通信し、レスポンスが戻ってきます。
この際、すべての情報を通信しているので、一瞬画面が白くなり画面遷移が行われます。同期通信の場合、サーバーからレスポンスが返ってくるまでは他の作業はできません。


・非同期通信

webブラウザから一部の情報のみをリクエストします。この際、一部の情報だけを通信しているので、画面が白くなり画面遷移することはありません。非同期通信の場合、サーバーからレスポンスが返ってこなくても他の作業ができます。



まとめると、Ajaxとは一部の情報をサーバーに送信して、それを受け取り反映させる仕組みのことを言います。それを可能にする技術的な仕組みは別記事で紹介します。




以上で簡単な、「1分でわかるAjax(概念編)」についての説明を終わります~

理解は深まりましたか? わからないことや、ご質問あればプログラミングカウンセリングサービス「ギクサポ」まで!

-1分でわかるシリーズ, Ajax, DOM, JSON, XML, XMLHttpRequest, 技術

Copyright© プログラミング超初心者向けサイト@ギクサポ , 2020 All Rights Reserved Powered by STINGER.