XMLHttpRequestをもちいて、数値データを読み込もうpart1

通信

通信...マシーンとマシーンでデータのやりとりを行うことです。
通信には色々ありますが、基本的なサーバーと自分のパソコンとの通信を考えてくださるといいと思います、
通信規格には２つの規格があります。(これ以外に通信規格があるよといいうかたはご教授ください)

同期通信

１つ、同期通信...サーバーにリクエストを送って、レスポンスがかえってくるまで、他の動作に移行しません。データ量が少ないものにたいしてはこのような規格が使われます。

非同期

２つめ、非同期通信...サーバーにリクエストを送ってレスポンスかえってくる、レスポンスがかえってくるまでに、他の作業が可能です。つまり、webページをリロードしなくとも、必要な時にリクエストをおくってレスポンスをもらっているのです。google mapなんかは移動する度に必要な情報を自動で取得しています。

http通信

HTTP通信には、通信方式として主なものにGETメソッドとPOSTメソッドというものがあります。 GETメソッドは、サーバからデータを受信することが目的である場合に使用します。 POSTメソッドは、サーバへデータを送信することが目的である場合に使用します。
GETメソッドでは、URLにリクエスト情報が含まれたものになります。
そのため、サーバへ多量のデータを送信することはできません。
また、パスワード等の個人情報をサーバへ送信する際、URLにその情報が丸見えになってしまうため、セキュリティの観点からGETメソッドを使用する訳にはいきませんね。
対してPOSTメソッドでは、通信するデータそのものにリクエスト情報が含まれます。
そのため、多量のデータを通信する際やパスワード等の個人情報を送信する際にはPOSTメソッドを使用します。
以上の理由から、サーバからデータを受信する際にはGETメソッド、サーバへデータを送信する際にはPOSTメソッドを使用します。

google chromeのローカルファイルに関する設定

widowsでは、google chromeで、ローカルファイルを読み込むときには
"--allow-file-access-from-files"
をリンク先に設定しなくてはなりません。
Macの場合も同様にgoogle chromeの設定しなくてはなりません。
ターミナルで--allow-file-access-from-filesのフラグ(?)をいれて実行しなければなりません。
自分はAutomatorで自動化させています。

XMLHttpRequestオブジェクト

javascript

var xml = new XMLHttpRequest();

これでXMLHttpRequestオブジェクトは生成されます。

openメソッド

オープンメッソドでは、通信方式、通信先、非同期通信するかのフラグが立てられます。
すなわち、通信方式の設定を指定いるのです。

javascript

xml.open(通信方式,通信先のurl,非同期通信のフラグ);

例

javascript

xml.open("GET","test.txt",true);

など

URL

URLっという単語を自分は曖昧につかってしまっていました。
URLはUniform Resource Locatorの略です。日本語にすると、統一資源位置指定子といいます。
Resource(情報資源)を特定する文字列です。
ですので、インターネット上にかぎったものではありません。
ファイル構造の中にある情報を指定するもの、ディレクトリのなかのディレクトリにあるもの。
macでいう、情報を視るから記述されている場所もurlなのです。

リクエストの送信

sendメソッドというものがあります。

javascript

xml.send();

これで、リクエストの送信ができます。

レスポンスの処理に関しては次の記事に書こうと思います。

次の記事
part2