非同期通信１

同期通信、非同期通信の違いは、

非同期通信においてはブラウザを再読み込みしなくても、ブラウザに表示される情報が自動で変わるという点である。

これを実現するには、JavaScriptを用いる。JavaScriptはブラウザ上でのポインターの動きによってメソッドの効果を発揮できる。

非同期通信の流れは、

１、ポインターの動きにJavaScriptが反応

２、得た情報をコントローラーに受け渡す。

３、コントローラーはモデルなどとやり取りをし、サーバー側からレスポンスが返ってくる。

４、JavaScriptがレスポンスを元に、ブラウザのHTML,CSSを改修してユーザーに表示

今回は、１と２について書く

１

HTMLの要素をdocumentを用いて取得し、それの動きによってJavaScript内のメソッドを動かす。この時、ユーザーによって送られたデータがある場合、まず、このデータはjson形式で送られる。そしてFormData(フォーム)という形式でインスタンスにこのデータを与える事ができる。

２

XMLHttpRequestを用いてサーバー側と通信を行う。まず、XHRインスタンスを生成し、このインスタンスに操作を行わせる。XHR.open()というメソッドによってHTTP通信のメソッドや、パス、そして非同期通信かどうかという情報を与える。また、XHR.send(データ)によってデータを送る事ができる。