Ajax&JSON

Ajaxとは?

Asynchronous JavaScript ans XMLの略として、クライアントが非同期サーバとどのように通信するか.
XMLまたはJSON形式のデータを非同期で転送します.
非同期は、サーバとの通信中に同時に多くのことが起こる可能性があることを意味します.
これは、サーバとの通信時間が長くても、Webリソースをより効率的に使用するために、この時間内に他のタスクを実行できることを意味します.
Ajaxでは、ページを切り替えずにデータをリフレッシュできます.
Ajax使用例

自動補完機能
検索するときは、ページを変えるのではなく、推奨される検索語を表示します.

ユーザー情報の表示
ユーザがウェブサイトに会員登録する際に情報(氏名、電話番号など)を暴露する機能.これにより、サーバ上でデータが収集されます.

JSON

JavaScriptオブジェクトアノテーションの略である「属性-値ペア」または「キー値ペア」からなるデータ・オブジェクトを渡すオープン・スタンダード・フォーマット.

上の写真はNodeJSのパッケージです.jsonファイルの一部.これらのキーと値はペアです.

JSON処理AJAXを使用

jsonデータ情報の移動

クライアント->サーバ
String送信に変換します.

data = JSON.stringify(data);

サーバ->クライアント
写真を撮ってもいいです.クライアントはparseを使用してstringによって受信されたjsonを処理する.

var result = JSON.parse(xhr.responseText);

サンプルコード

上記のコードは、次のように基本フレームワークを作成します.

この写真では、inputウィンドウに値を入力しajaxsendボタンを押すと、次のコードがjsonを使用してajax転送を開始します.

最終実行結果

これにより、入力したEメールが画面に表示されるかどうかを確認できます.