XMLHttpRequest について

// XMLHttpRequest オブジェクトを作成
var xhr = new XMLHttpRequest();

// 出力テスト
console.log(xhr);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成する関数
// ------------------------------------------------------------
function XMLHttpRequestCreate(){

	// ------------------------------------------------------------
	// XMLHttpRequest オブジェクトを作成
	// ------------------------------------------------------------
	try{
		return new XMLHttpRequest();
	}catch(e){}

	// ------------------------------------------------------------
	// Internet Explorer 6 用
	// ------------------------------------------------------------
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.3.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP');
	}catch(e){}

	// ------------------------------------------------------------
	// 未対応
	// ------------------------------------------------------------
	return null;
}

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成する関数
// ------------------------------------------------------------
function XMLHttpRequestCreate(){
	try{
		return new XMLHttpRequest();
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.3.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP');
	}catch(e){}

	return null;
}

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = XMLHttpRequestCreate();

// ------------------------------------------------------------
// XHR 通信の状態が変化するたびに実行されるイベント
// ------------------------------------------------------------
xhr.onreadystatechange = function (){

	switch(xhr.readyState){
	case 4:
		// ------------------------------------------------------------
		// XHR 通信失敗
		// ------------------------------------------------------------
		if(xhr.status == 0){

			alert("XHR 通信失敗");

		// ------------------------------------------------------------
		// XHR 通信成功
		// ------------------------------------------------------------
		}else{

			// ------------------------------------------------------------
			// リクエスト成功
			// ------------------------------------------------------------
			if((200 <= xhr.status && xhr.status < 300) || (xhr.status == 304)){

				alert("受信:" + xhr.responseText);

			// ------------------------------------------------------------
			// リクエスト失敗
			// ------------------------------------------------------------
			}else{

				alert("その他の応答:" + xhr.status);

			}
		}
		break;
	}
};

// ------------------------------------------------------------
// 「POST メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
var url = "http://example.com/test.cgi";
xhr.open("POST" , url);

// ------------------------------------------------------------
// 「送信データ」を指定、XHR 通信を開始する
// ------------------------------------------------------------
var send_data = "送信テスト";
xhr.send(send_data);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
var url = "http://example.com/test.cgi";
xhr.open("GET" , url);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// 「POST メソッド」「接続先 URL」「非同期実行」「ユーザー名」「パスワード」を指定
// ------------------------------------------------------------
var url = "http://example.com/test.cgi";
xhr.open("POST" , url , true , "myname" , "mypassword");

http://sub.example.com/test.cgi?user=taro&age=18&blood=b
http://sub.example.com/test.cgi?user=hanako&age=16&blood=o#FRAGMENT_IDENTIFIER

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成する関数
// ------------------------------------------------------------
function XMLHttpRequestCreate(){
	try{
		return new XMLHttpRequest();
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.3.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP');
	}catch(e){}

	return null;
}

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = XMLHttpRequestCreate();

// ------------------------------------------------------------
// 「POST メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("POST" , "http://example.com/test.cgi");

// ------------------------------------------------------------
// 送信データの「コンテンツタイプ」を指定
// ------------------------------------------------------------
xhr.setRequestHeader("Content-Type" , "text/plain");

// ------------------------------------------------------------
// 「送信データ」を指定、XHR 通信を開始する
// ------------------------------------------------------------
xhr.send("Hello World !!");

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成する関数
// ------------------------------------------------------------
function XMLHttpRequestCreate(){
	try{
		return new XMLHttpRequest();
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.3.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP');
	}catch(e){}

	return null;
}

// ------------------------------------------------------------
// 送信情報
// ------------------------------------------------------------
// 送信したい文字列
var send_data = "Hello World !!";

// アクセス先 URL
var url = "http://example.com/test.cgi";

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = XMLHttpRequestCreate();

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定（送信したいデータを URL に含める）
// ------------------------------------------------------------
xhr.open("GET" , url + "?" + encodeURIComponent(send_data));

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成する関数
// ------------------------------------------------------------
function XMLHttpRequestCreate(){
	try{
		return new XMLHttpRequest();
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.3.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP');
	}catch(e){}

	return null;
}

// ------------------------------------------------------------
// 送信情報
// ------------------------------------------------------------
// 送信したい文字列
var send_data = "Hello World !!";

// アクセス先 URL
var url = "http://example.com/test.cgi";

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = XMLHttpRequestCreate();

// ------------------------------------------------------------
// 「POST メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("POST" , url);

// ------------------------------------------------------------
// 「送信データ」を指定、XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(send_data);

// 匿名関数を即時実行
(function(){

	// ------------------------------------------------------------
	// FormData に対応していない
	// ------------------------------------------------------------
	if(!(window.FormData)) return;

	// ------------------------------------------------------------
	// FormData オブジェクトを作成する
	// ------------------------------------------------------------
	var form_data = new FormData();

	// ------------------------------------------------------------
	// 名前と値を指定してデータを追加する
	// ------------------------------------------------------------
	form_data.append("aaa" , "value_a");
	form_data.append("bbb" , "value_b");
	form_data.append("ccc" , "value_c");

	// ------------------------------------------------------------
	// XMLHttpRequest オブジェクトを作成
	// ------------------------------------------------------------
	var xhr = new XMLHttpRequest();

	// ------------------------------------------------------------
	// 「POST メソッド」「接続先 URL」を指定
	// ------------------------------------------------------------
	xhr.open("POST" , "http://example.com/cgi-bin/upload.cgi");

	// ------------------------------------------------------------
	// 送信データに FormData を指定、XHR 通信を開始する
	// ------------------------------------------------------------
	xhr.send(form_data);
})();

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成する関数
// ------------------------------------------------------------
function XMLHttpRequestCreate(){
	try{
		return new XMLHttpRequest();
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.3.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP');
	}catch(e){}

	return null;
}

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = XMLHttpRequestCreate();

// ------------------------------------------------------------
// XHR 通信の状態が変化するたびに実行されるイベント
// ------------------------------------------------------------
xhr.onreadystatechange = function(){
	if(xhr.readyState == 4){
		console.log("STATUS:" + xhr.status);
	}
};

// ------------------------------------------------------------
// 「POST メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("POST" , "http://example.com/test.cgi");

// ------------------------------------------------------------
// 「送信データ」を指定、XHR 通信を開始する
// ------------------------------------------------------------
xhr.send("Hello World !!");

// ------------------------------------------------------------
// XHR 通信を中止する
// ------------------------------------------------------------
xhr.abort();

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// XHR 通信を中止すると実行されるイベント
// ------------------------------------------------------------
xhr.onabort = function(e){
	console.log("XHR 通信中止");
};

// ------------------------------------------------------------
// 「POST メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("POST" , "http://example.com/test.cgi");

// ------------------------------------------------------------
// 「送信データ」を指定、XHR 通信を開始する
// ------------------------------------------------------------
xhr.send("Hello World !!");

// ------------------------------------------------------------
// XHR 通信を中止する
// ------------------------------------------------------------
xhr.abort();

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , "http://example.com/test.cgi");

// ------------------------------------------------------------
// タイムアウト機能をサポートしているか
// ------------------------------------------------------------
if(xhr.timeout !== undefined){

	// ------------------------------------------------------------
	// タイムアウトエラー発生時に実行されるイベント
	// ------------------------------------------------------------
	xhr.ontimeout = function(e){
		console.log("タイムアウトエラー発生");
	};

	// ------------------------------------------------------------
	// タイムアウトエラーが発生するまでの時間（ミリ秒）を設定
	// ------------------------------------------------------------
	xhr.timeout = 2000;

}

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// Blob オブジェクトを作成（Shift-JIS 形式のプレーンテキスト）
// ------------------------------------------------------------
var blob = new Blob([new Uint8Array([ 0x82,0xa0 , 0x82,0xa2 , 0x82,0xa4 ])] , {type:"text/plain"});

// Blob URL Scheme を生成する
var blob_url = window.URL.createObjectURL(blob);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// XHR 送信が成功したときに実行されるイベント
// ------------------------------------------------------------
xhr.onload = function(e){
	// 出力テスト
	console.log(xhr.responseText); // "あいう"
};

// ------------------------------------------------------------
// 「GET メソッド」「Blob URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , blob_url);

// ------------------------------------------------------------
// overrideMimeType メソッドをサポートしている
// ------------------------------------------------------------
if(xhr.overrideMimeType){

	// ------------------------------------------------------------
	// 「MIME Type」のオーバーライドを設定する
	// ------------------------------------------------------------
	xhr.overrideMimeType("text/plain; charset=Shift_JIS");

}

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// Blob オブジェクトを作成（ XML が書かれたプレーンテキスト）
// ------------------------------------------------------------
var blob = new Blob(['<xml><element attribute="value">text</element></xml>'] , {type:"text/plain"});

// Blob URL Scheme を生成する
var blob_url = window.URL.createObjectURL(blob);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// XHR 送信が成功したときに実行されるイベント
// ------------------------------------------------------------
xhr.onload = function(e){
	// 出力テスト
	console.log(xhr.responseXML);
};

// ------------------------------------------------------------
// 「GET メソッド」「Blob URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , blob_url);

// ------------------------------------------------------------
// overrideMimeType メソッドをサポートしている
// ------------------------------------------------------------
if(xhr.overrideMimeType){

	// ------------------------------------------------------------
	// 「MIME Type」のオーバーライドを設定する
	// ------------------------------------------------------------
	xhr.overrideMimeType("application/xml");

}

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// Blob オブジェクトを作成（バイナリ）
// ------------------------------------------------------------
var blob = new Blob([new Uint8Array([ 0xe3,0x81,0x82,0xe3,0x81,0x84,0xe3,0x81,0x86 ])] , {type:"application/octet-stream"});

// Blob URL Scheme を生成する
var blob_url = window.URL.createObjectURL(blob);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// XHR 送信が成功したときに実行されるイベント
// ------------------------------------------------------------
xhr.onload = function(e){

	var x_user_defined = xhr.responseText;

	// 総サイズを取得
	var size = x_user_defined.length;

	// Uint8Array オブジェクトを作成
	var ary_u8 = new Uint8Array(size);

	// 下位１バイトを順番にコピー
	var i;
	for(i=0;i < size;i++){
		ary_u8[i] = x_user_defined.charCodeAt(i) & 0xFF;
	}

	// 出力テスト
	console.log(ary_u8); // [0xe3,0x81,0x82,0xe3,0x81,0x84,0xe3,0x81,0x86]
};

// ------------------------------------------------------------
// 「GET メソッド」「Blob URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , blob_url);

// ------------------------------------------------------------
// overrideMimeType メソッドをサポートしている
// ------------------------------------------------------------
if(xhr.overrideMimeType){

	// ------------------------------------------------------------
	// 「MIME Type」のオーバーライドを設定する
	// ------------------------------------------------------------
	xhr.overrideMimeType("text/plain; charset=x-user-defined");

}

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// XMLHttpRequestUpload オブジェクトを取得
// ------------------------------------------------------------
var upload = xhr.upload;

// 出力テスト
console.log(upload);

// ------------------------------------------------------------
// 1 Mbyte 相当の Uint8Array オブジェクトを作成
// ------------------------------------------------------------
var ary_u8 = new Uint8Array(1024 * 1024 * 1);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// XMLHttpRequestUpload オブジェクトを取得
// ------------------------------------------------------------
var upload = xhr.upload;
if(upload){

	// ------------------------------------------------------------
	// 送信が成功したときに実行されるイベント
	// ------------------------------------------------------------
	upload.onload = function(e){
		console.log("送信に成功");
	};

	// ------------------------------------------------------------
	// 送信が失敗したときに実行されるイベント
	// ------------------------------------------------------------
	upload.onerror = function(e){
		console.log("送信に失敗");
	};

	// ------------------------------------------------------------
	// 送信中に XHR 通信を中止すると実行されるイベント
	// ------------------------------------------------------------
	upload.onabort = function(e){
		console.log("XHR 通信を中止");
	};

	// ------------------------------------------------------------
	// 送信中にタイムアウトエラーが発生すると実行されるイベント
	// ------------------------------------------------------------
	upload.ontimeout = function(e){
		console.log("タイムアウトエラーが発生");
	};

}

// ------------------------------------------------------------
// 「POST メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("POST" , "http://example.com/upload.cgi");

// ------------------------------------------------------------
// 「送信データ」を指定、XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(ary_u8);

// ------------------------------------------------------------
// 10 Mbyte 相当の Uint8Array オブジェクトを作成
// ------------------------------------------------------------
var ary_u8 = new Uint8Array(1024 * 1024 * 10);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// XMLHttpRequestUpload オブジェクトを取得
// ------------------------------------------------------------
var upload = xhr.upload;
if(upload){

	// ------------------------------------------------------------
	// 送信を開始したときに実行されるイベント
	// ------------------------------------------------------------
	upload.onloadstart = function(e){
		console.log("送信を開始");
	};

	// ------------------------------------------------------------
	// 送信中に繰り返し実行されるイベント
	// ------------------------------------------------------------
	upload.onprogress = function(e){
		console.log("送信中: " + e.loaded + " / " + e.total);
	};

	// ------------------------------------------------------------
	// 送信が完了したときに実行されるイベント
	// ------------------------------------------------------------
	upload.onloadend = function(e){
		console.log("送信が完了");
	};
}

// ------------------------------------------------------------
// 「POST メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("POST" , "http://example.com/upload.cgi");

// ------------------------------------------------------------
// 「送信データ」を指定、XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(ary_u8);

<html>
  <body>

    <form id="my_form" action="http://example.com/cgi-bin/upload.cgi" method="post" enctype="multipart/form-data" >

      <input type="file" name="input_file0"> <br>
      <input type="file" name="input_file1"> <br>

      <input type="submit" value="送信">

    </form>

    <div id="my_result" style="width:300px; text-align:right; margin-bottom:5px;"> --- </div>

    <div style="width:300px; height:10px; background:#fff; border:2px solid #000; line-height:0;">
	    <div id="my_progress" style="width:0px; height:10px; background:#ccc;"></div>
    </div>

    <script type="text/javascript">
    <!--
	// 匿名関数を即時実行
	(function(){

		// ------------------------------------------------------------
		// サポートチェック
		// ------------------------------------------------------------
		// イベントリスナーに対応していない
		if(!(window.addEventListener)) return;
		// FormData に対応していない
		if(!(window.FormData)) return;

		// ------------------------------------------------------------
		// 各エレメントを取得
		// ------------------------------------------------------------
		// id 属性が "my_form" であるエレメントを取得
		var form = document.getElementById("my_form");

		// id 属性が "my_result" であるエレメントを取得
		var result = document.getElementById("my_result");

		// id 属性が "my_progress" であるエレメントを取得
		var progress = document.getElementById("my_progress");

		// ------------------------------------------------------------
		// サブミット直前に実行されるイベント
		// ------------------------------------------------------------
		form.addEventListener("submit" , function(e){

			// ------------------------------------------------------------
			// フォームの送信処理を中止
			// ------------------------------------------------------------
			e.preventDefault();

			// ------------------------------------------------------------
			// FormData オブジェクトを作成
			// ------------------------------------------------------------
			var form_data = new FormData(form);

			// ------------------------------------------------------------
			// XMLHttpRequest オブジェクトを作成
			// ------------------------------------------------------------
			var xhr = new XMLHttpRequest();

			// ------------------------------------------------------------
			// XMLHttpRequestUpload オブジェクトを取得
			// ------------------------------------------------------------
			var upload = xhr.upload;

			// ------------------------------------------------------------
			// 送信中に繰り返し実行されるイベント
			// ------------------------------------------------------------
			upload.onprogress = function(e){

				// リザルトを更新
				result.textContent = e.loaded + " / " + e.total + " Byte";

				// プログレスバーを更新
				if(e.lengthComputable){
					var percent = (e.loaded / e.total * 100);
					progress.style.width = (percent) + "%";
				}
			};

			// ------------------------------------------------------------
			// 「POST メソッド」「接続先 URL」を指定（フォームの action 属性の値を使用）
			// ------------------------------------------------------------
			xhr.open("POST" , form.action);

			// ------------------------------------------------------------
			// 送信データに FormData を指定、XHR 通信を開始する
			// ------------------------------------------------------------
			xhr.send(form_data);
		});
	})();

    //-->
    </script>

  </body>
</html>

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成する関数
// ------------------------------------------------------------
function XMLHttpRequestCreate(){
	try{
		return new XMLHttpRequest();
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.3.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP');
	}catch(e){}

	return null;
}

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = XMLHttpRequestCreate();

// ------------------------------------------------------------
// XHR 通信の状態が変化するたびに実行されるイベント
// ------------------------------------------------------------
xhr.onreadystatechange = function (){

	switch(xhr.readyState){
	case 1:
		console.log("open() メソッドの呼び出しが完了した");
		break;

	case 2:
		console.log("レスポンスヘッダの受信が完了した");
		break;

	case 3:
		console.log("レスポンスボディを受信中（繰り返し実行される）");
		break;

	case 4:
		console.log("XHR 通信が完了した（成功失敗に関わらず）");
		break;
	};
};

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , "http://example.com/test.cgi");

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成する関数
// ------------------------------------------------------------
function XMLHttpRequestCreate(){
	try{
		return new XMLHttpRequest();
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.3.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP');
	}catch(e){}

	return null;
}

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = XMLHttpRequestCreate();

// ------------------------------------------------------------
// XHR 通信の状態が変化するたびに実行されるイベント
// ------------------------------------------------------------
xhr.onreadystatechange = function (){

	switch(xhr.readyState){
	case 4:
		// ------------------------------------------------------------
		// XHR 通信失敗
		// ------------------------------------------------------------
		if(xhr.status == 0){

			console.log("XHR 通信失敗");

		// ------------------------------------------------------------
		// XHR 通信成功
		// ------------------------------------------------------------
		}else{

			console.log("XHR 通信成功");
			console.log("ステータスコード:" + xhr.status);
			console.log("ステータス:" + xhr.statusText);

			// ------------------------------------------------------------
			// リクエスト成功
			// ------------------------------------------------------------
			if((200 <= xhr.status && xhr.status < 300) || (xhr.status == 304)){

				console.log("リクエスト成功");

			// ------------------------------------------------------------
			// リクエスト失敗
			// ------------------------------------------------------------
			}else{

				console.log("リクエスト失敗");

			}
		}
		break;
	}
};

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , "http://example.com/test.cgi");

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成する関数
// ------------------------------------------------------------
function XMLHttpRequestCreate(){
	try{
		return new XMLHttpRequest();
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.3.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP');
	}catch(e){}

	return null;
}

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = XMLHttpRequestCreate();

// ------------------------------------------------------------
// XHR 通信の状態が変化するたびに実行されるイベント
// ------------------------------------------------------------
xhr.onreadystatechange = function (){

	// ------------------------------------------------------------
	// レスポンスヘッダの受信が完了した
	// ------------------------------------------------------------
	if(xhr.readyState == 2){

		// ------------------------------------------------------------
		// レスポンスヘッダの情報を１つずつ取得
		// ------------------------------------------------------------
		// コンテンツタイプを取得
		var content_type   = xhr.getResponseHeader("Content-Type");

		// コンテンツのデータサイズを取得
		var content_length = xhr.getResponseHeader("Content-Length");

		// 最終更新日を取得
		var last_modified  = xhr.getResponseHeader("Last-Modified");

		// ------------------------------------------------------------
		// 出力テスト
		// ------------------------------------------------------------
		console.log("Content-Type: "   + content_type);
		console.log("Content-Length: " + content_length);
		console.log("Last-Modified: "  + last_modified);

	}
};

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , "http://example.com/test.cgi");

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成する関数
// ------------------------------------------------------------
function XMLHttpRequestCreate(){
	try{
		return new XMLHttpRequest();
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.3.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP');
	}catch(e){}

	return null;
}

// ------------------------------------------------------------
// レスポンスヘッダ文字列からオブジェクトに変換する関数
// ------------------------------------------------------------
function ResponseHeadersParseObject(str){
	var o = new Object();
	if(!str) return o;

	var a = str.replace(/\r\n?/g,"\n").split("\n");
	var m;
	var i;
	var num = a.length;
	for(i=0;i < num;i++){
		m = a[i].match(new RegExp("^(.*?):[ ](.*)$","i"));
		if(m){
			o[m[1]] = m[2];
		}
	}
	return o;
}

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = XMLHttpRequestCreate();

// ------------------------------------------------------------
// XHR 通信の状態が変化するたびに実行されるイベント
// ------------------------------------------------------------
xhr.onreadystatechange = function (){

	// ------------------------------------------------------------
	// レスポンスヘッダの受信が完了した
	// ------------------------------------------------------------
	if(xhr.readyState == 2){

		// ------------------------------------------------------------
		// レスポンスヘッダ文字列からオブジェクトに変換
		// ------------------------------------------------------------
		var response_headers = ResponseHeadersParseObject(xhr.getAllResponseHeaders());

		// ------------------------------------------------------------
		// レスポンスヘッダの情報を１つずつ取得
		// ------------------------------------------------------------
		// コンテンツタイプを取得
		var content_type   = response_headers["Content-Type"];

		// コンテンツのデータサイズを取得
		var content_length = response_headers["Content-Length"];

		// 最終更新日を取得
		var last_modified  = response_headers["Last-Modified"];

		// ------------------------------------------------------------
		// 出力テスト
		// ------------------------------------------------------------
		console.log("Content-Type: "   + content_type);
		console.log("Content-Length: " + content_length);
		console.log("Last-Modified: "  + last_modified);

	}
};

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , "http://example.com/test.cgi");

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成する関数
// ------------------------------------------------------------
function XMLHttpRequestCreate(){
	try{
		return new XMLHttpRequest();
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.3.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP');
	}catch(e){}

	return null;
}

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = XMLHttpRequestCreate();

// ------------------------------------------------------------
// XHR 通信の状態が変化するたびに実行されるイベント
// ------------------------------------------------------------
xhr.onreadystatechange = function (){

	switch(xhr.readyState){

	// ------------------------------------------------------------
	// レスポンスボディを受信中（繰り返し実行される）
	// ------------------------------------------------------------
	case 3:
		console.log("受信中 :" + xhr.responseText.length + " characters");
		break;

	// ------------------------------------------------------------
	// XHR 通信が完了した（成功失敗に関わらず）
	// ------------------------------------------------------------
	case 4:

		// ------------------------------------------------------------
		// リクエスト成功
		// ------------------------------------------------------------
		if((200 <= xhr.status && xhr.status < 300) || (xhr.status == 304)){

			console.log("レスポンス:" + xhr.responseText);

		// ------------------------------------------------------------
		// リクエスト失敗
		// ------------------------------------------------------------
		}else{
			console.log("リクエスト失敗");

		}
		break;
	}
};

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , "http://example.com/test.cgi");

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成する関数
// ------------------------------------------------------------
function XMLHttpRequestCreate(){
	try{
		return new XMLHttpRequest();
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP.3.0');
	}catch(e){}
	try{
		return new ActiveXObject('MSXML2.XMLHTTP');
	}catch(e){}

	return null;
}

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = XMLHttpRequestCreate();

// ------------------------------------------------------------
// XHR 通信の状態が変化するたびに実行されるイベント
// ------------------------------------------------------------
xhr.onreadystatechange = function (){

	switch(xhr.readyState){

	// ------------------------------------------------------------
	// レスポンスボディを受信中（繰り返し実行される）
	// ------------------------------------------------------------
	case 3:
		console.log("受信中 :" + xhr.responseText.length + " characters");
		break;

	// ------------------------------------------------------------
	// XHR 通信が完了した（成功失敗に関わらず）
	// ------------------------------------------------------------
	case 4:

		// ------------------------------------------------------------
		// リクエスト成功
		// ------------------------------------------------------------
		if((200 <= xhr.status && xhr.status < 300) || (xhr.status == 304)){

			// Document オブジェクトを取得
			var xml_document = xhr.responseXML;

			// 出力テスト
			console.log(xml_document);

		// ------------------------------------------------------------
		// リクエスト失敗
		// ------------------------------------------------------------
		}else{
			console.log("リクエスト失敗");

		}
		break;
	}
};

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , "http://example.com/test.xml");

// ------------------------------------------------------------
// overrideMimeType メソッドをサポートしている
// ------------------------------------------------------------
if(xhr.overrideMimeType){

	// ------------------------------------------------------------
	// 「MIME Type」のオーバーライドを設定する
	// ------------------------------------------------------------
	xhr.overrideMimeType("application/xml");

}

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// XHR 送信が成功したときに実行されるイベント
// ------------------------------------------------------------
xhr.onload = function(e){

	// 指定したデータ型でレスポンスボディの内容を取得
	var ary_buffer = xhr.response;

	// 出力テスト
	console.log(ary_buffer);
};

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , "http://example.com/download/test.dat");

// ------------------------------------------------------------
// レスポンスタイプを設定
// ------------------------------------------------------------
xhr.responseType = "arraybuffer";

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// Blob オブジェクトを作成（JSON 文書）
// ------------------------------------------------------------
var blob = new Blob(['{"aaa":0,"bbb":1,"ccc":2}'] , {type:"application/json"});

// Blob URL Scheme を生成する
var blob_url = window.URL.createObjectURL(blob);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// XHR 送信が成功したときに実行されるイベント
// ------------------------------------------------------------
xhr.onload = function(e){

	// 指定したデータ型でレスポンスボディの内容を取得
	var obj = xhr.response;

	// 出力テスト
	console.log(obj); // {aaa:0,bbb:1,ccc:2}
};

// ------------------------------------------------------------
// 「GET メソッド」「Blob URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , blob_url);

// ------------------------------------------------------------
// レスポンスタイプを設定
// ------------------------------------------------------------
xhr.responseType = "json";

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// 受信中に繰り返し実行されるイベント
// ------------------------------------------------------------
xhr.onprogress = function(e){

	// 出力テスト
	console.log("ダウンロード中:" + e.loaded + " / " + e.total);
};

// ------------------------------------------------------------
// XHR 送信が成功したときに実行されるイベント
// ------------------------------------------------------------
xhr.onload = function(e){

	// ------------------------------------------------------------
	// Blob URL を生成
	// ------------------------------------------------------------
	var blob_url = window.URL.createObjectURL(xhr.response);

	// ------------------------------------------------------------
	// HTMLAnchorElement オブジェクトを作成する
	// ------------------------------------------------------------
	var anchor = document.createElement("a");

	// ターゲットを設定
	anchor.target = "_blank";

	// Blob URLを指定
	anchor.href = blob_url;

	// デフォルトのファイル名を指定
	anchor.download = "test.dat";

	// ------------------------------------------------------------
	// ダウンロードを開始する
	// ------------------------------------------------------------
	document.body.appendChild(anchor);
	anchor.click();
	anchor.parentNode.removeChild(anchor);

};

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定（アンカーの href 属性の値を使用）
// ------------------------------------------------------------
xhr.open("GET" , "http://example.com/download/test.dat");

// ------------------------------------------------------------
// レスポンスタイプを設定
// ------------------------------------------------------------
xhr.responseType = "blob";

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// XHR 送信が成功したときに実行されるイベント
// ------------------------------------------------------------
xhr.onload = function(e){
	console.log("受信に成功");
};

// ------------------------------------------------------------
// XHR 送信が失敗したときに実行されるイベント
// ------------------------------------------------------------
xhr.onerror = function(e){
	console.log("受信に失敗");
};

// ------------------------------------------------------------
// XHR 通信を中止すると実行されるイベント
// ------------------------------------------------------------
xhr.onabort = function(e){
	console.log("XHR 通信を中止");
};

// ------------------------------------------------------------
// タイムアウトエラー発生時に実行されるイベント
// ------------------------------------------------------------
xhr.ontimeout = function(e){
	console.log("タイムアウトエラーが発生");
};

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , "http://example.com/download/test.dat");

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// XHR 通信を開始したときに実行されるイベント
// ------------------------------------------------------------
xhr.onloadstart = function(e){
	console.log("受信を開始");
};

// ------------------------------------------------------------
// 受信中に繰り返し実行されるイベント
// ------------------------------------------------------------
xhr.onprogress = function(e){
	console.log("受信中: " + e.loaded + " / " + e.total);
};

// ------------------------------------------------------------
// XHR 通信が完了したときに実行されるイベント
// ------------------------------------------------------------
xhr.onloadend = function(e){
	console.log("受信が完了");
};

// ------------------------------------------------------------
// 「GET メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("GET" , "http://example.com/download/test.dat");

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

<html>
  <body>

    <a href="http://example.com/download/test.dat" download="test.dat" id="my_anchor">ダウンロード</a>

    <div id="my_result" style="width:300px; text-align:right; margin-bottom:5px;"> --- </div>

    <div style="width:300px; height:10px; background:#fff; border:2px solid #000; line-height:0;">
	    <div id="my_progress" style="width:0px; height:10px; background:#ccc;"></div>
    </div>

    <script type="text/javascript">
    <!--

	// ------------------------------------------------------------
	// 各エレメントを取得
	// ------------------------------------------------------------
	// id 属性が "my_anchor" であるエレメントを取得
	var anchor = document.getElementById("my_anchor");

	// id 属性が "my_result" であるエレメントを取得
	var result = document.getElementById("my_result");

	// id 属性が "my_progress" であるエレメントを取得
	var progress = document.getElementById("my_progress");

	// ------------------------------------------------------------
	// クリック時に実行されるイベント
	// ------------------------------------------------------------
	anchor.addEventListener("click" , function callee(e){

		// イベントのリッスンを終了
		anchor.removeEventListener(e.type , callee);

		// デフォルトの動作をキャンセル
		e.preventDefault();

		// ------------------------------------------------------------
		// XMLHttpRequest オブジェクトを作成
		// ------------------------------------------------------------
		var xhr = new XMLHttpRequest();

		// ------------------------------------------------------------
		// サポートチェック
		// ------------------------------------------------------------
		if(xhr.responseType === undefined) return;
		if(!(window.URL)) return;

		// ------------------------------------------------------------
		// 受信中に繰り返し実行されるイベント
		// ------------------------------------------------------------
		xhr.onprogress = function(e){

			// リザルトを更新
			result.textContent = e.loaded + " / " + e.total + " Byte";

			// プログレスバーを更新
			if(e.lengthComputable){
				var percent = (e.loaded / e.total * 100);
				progress.style.width = (percent) + "%";
			}
		};

		// ------------------------------------------------------------
		// XHR 送信が成功したときに実行されるイベント
		// ------------------------------------------------------------
		xhr.onload = function(e){

			// Blob URL を生成
			var blob_url = window.URL.createObjectURL(xhr.response);

			// リンク先を Blob URL に変更
			anchor.href = blob_url;

			// アンカーをクリック
			anchor.click();
		};

		// ------------------------------------------------------------
		// 「GET メソッド」「接続先 URL」を指定（アンカーの href 属性の値を使用）
		// ------------------------------------------------------------
		xhr.open("GET" , anchor.href);

		// ------------------------------------------------------------
		// レスポンスタイプを設定
		// ------------------------------------------------------------
		xhr.responseType = "blob";

		// ------------------------------------------------------------
		// XHR 通信を開始する
		// ------------------------------------------------------------
		xhr.send(null);

	});
    //-->
    </script>

  </body>
</html>

// ------------------------------------------------------------
// XMLHttpRequest オブジェクトを作成
// ------------------------------------------------------------
var xhr = new XMLHttpRequest();

// ------------------------------------------------------------
// XHR 送信が成功したときに実行されるイベント
// ------------------------------------------------------------
xhr.onload = function(e){

	// 最終的なリダイレクト先の URL アドレスを取得する
	var final_url = xhr.responseURL;

	// 出力テスト
	console.log(final_url);
};

// ------------------------------------------------------------
// 「HEAD メソッド」「接続先 URL」を指定
// ------------------------------------------------------------
xhr.open("HEAD" , "http://t.co/lJ5lPCLZnG");

// ------------------------------------------------------------
// XHR 通信を開始する
// ------------------------------------------------------------
xhr.send(null);

#!/usr/local/bin/perl

# GETメソッドであるか調べる
if ($ENV{'REQUEST_METHOD'} eq "GET") {

}

#!/usr/local/bin/perl


# パラメータを格納する為の連想配列
%request_param;

# GETメソッドであるか調べる
if ($ENV{'REQUEST_METHOD'} eq "GET") {
	
	# URL の ? 以降の文字列を取得する
	$query = $ENV{'QUERY_STRING'};

	# "&" で区切って、配列に格納する
	@list = split(/&/,$query);
	foreach(@list) {

		# "=" で区切る
		($k,$v) = split(/=/,$_);

		# URL デコードを行い値を連想配列に格納する
		$request_param{"$k"} = UrlDecode($v);
	}
}


#// -----------------------------------------------------
#// ＵＲＬデコード
#// -----------------------------------------------------
sub UrlDecode {
	my $str = @_[0];
	$str =~ tr/+/ /;
	$str =~ s/%([0-9A-Fa-f][0-9A-Fa-f])/pack('H2', $1)/eg;
	return $str;
}

#!/usr/local/bin/perl

# POSTメソッドであるか調べる
if ($ENV{'REQUEST_METHOD'} eq "POST") {

}

#!/usr/local/bin/perl


# パラメータを格納する為の連想配列
%request_param;

# POSTメソッドであるか調べる
if ($ENV{'REQUEST_METHOD'} eq "POST") {
	
	# 標準入力からパラメータを取得する
	read (STDIN, $query, $ENV{'CONTENT_LENGTH'});

	# "&" で区切って、配列に格納する
	@list = split(/&/,$query);
	foreach(@list) {

		# "=" で区切る
		($k,$v) = split(/=/,$_);

		# URL デコードを行い値を連想配列に格納する
		$request_param{"$k"} = UrlDecode($v);

	}
}


#// -----------------------------------------------------
#// ＵＲＬデコード
#// -----------------------------------------------------
sub UrlDecode {
	my $str = @_[0];
	$str =~ tr/+/ /;
	$str =~ s/%([0-9A-Fa-f][0-9A-Fa-f])/pack('H2', $1)/eg;
	return $str;
}

#!/usr/local/bin/perl


# Content-type を出力
print "Content-type:text/plain\n";

# 改行のみでヘッダの終了
print "\n";

# 文字列を出力
print "Hallo World!!";

#!/usr/local/bin/perl


# Content-type を出力
print "Content-type:text/html\n";

# 改行のみでヘッダの終了
print "\n";

# HTML 文字列をヒアドキュメントで出力
print << "EOF";
<html>
<body>
	<b>Hallo World!!<b>
</body>
</html>
EOF
# ---

#!/usr/local/bin/perl


# Content-type を出力
print "Content-type:application/x-www-form-urlencoded\n";

# 改行のみでヘッダの終了
print "\n";

# 変数
$user = "hanako";
$age = 16;
$blood = "o";

# パラメータを出力
print "user=" . "$user";
print "&";
print "age=" . "$age";
print "&";
print "blood=" . "$blood";

#!/usr/local/bin/perl


# Content-type を出力
print "Content-type:application/json\n";

# 改行のみでヘッダの終了
print "\n";

# 変数
$user = "hanako";
$age = 16;
$blood = "o";

# パラメータを出力
print "{";
print "\"user\":\"" . "$user" . "\",";
print "\"age\":" . "$age" . ",";
print "\"blood\":\"" . "blood" . "\"";
print "}";

<?php

	# GETメソッドであるか調べる
	if ($_SERVER['REQUEST_METHOD'] == "GET") {

	}

?>

<?php

	# パラメータを格納する為の連想配列
	$request_param;

	# GETメソッドであるか調べる
	if ($_SERVER['REQUEST_METHOD'] == "GET") {

		foreach ( $_GET as $k => $v){

			# URL デコードを行い値を連想配列に格納する
			$request_param{"$k"} = urldecode($v);
		}
	}

?>

<?php

	# POSTメソッドであるか調べる
	if ($_SERVER['REQUEST_METHOD'] == "POST") {

	}

?>

<?php

	# パラメータを格納する為の連想配列
	$request_param;

	# POSTメソッドであるか調べる
	if ($_SERVER['REQUEST_METHOD'] == "POST") {

		foreach ( $_POST as $k => $v){

			# URL デコードを行い値を連想配列に格納する
			$request_param{"$k"} = urldecode($v);
		}
	}

?>

<?php

	# Content-type を出力
	header("Content-type:text/plain");

	# 文字列を出力
	echo "Hallo World!!";

?>

<?php

	# Content-type を出力
	header("Content-type:text/html");

	# HTML 文字列をヒアドキュメントで出力
	print <<<EOF
<html>
<body>
	<b>Hallo World!!<b>
</body>
</html>
EOF;

?>

<?php

	# Content-type を出力
	header("Content-type:application/x-www-form-urlencoded");

	# 変数
	$user = "hanako";
	$age = 16;
	$blood = "o";

	# パラメータを出力
	echo "user=" . $user;
	echo "&";
	echo "age=" . $age;
	echo "&";
	echo "blood=" . $blood;

?>

<?php

	# Content-type を出力
	header("Content-type:application/json");

	# 変数
	$user = "hanako";
	$age = 16;
	$blood = "o";

	# パラメータを出力
	echo "{";
	echo "\"user\":\"" . $user . "\",";
	echo "\"age\":" . $age . ",";
	echo "\"blood\":\"" . $blood . "\"";
	echo "}";

?>

#!/usr/local/bin/ruby

# GETメソッドであるか調べる
if ENV['REQUEST_METHOD'] == "GET" then

end

#!/usr/local/bin/ruby


# ライブラリをロード
require 'cgi'

# パラメータを格納する為の連想配列
request_param = Hash.new

# GETメソッドであるか調べる
if ENV['REQUEST_METHOD'] == "GET" then

	# URL の ? 以降の文字列を取得する
	query = ENV['QUERY_STRING']

	# "&" で区切る
	for q in query.split("&") do
		# "=" で区切る
		k, v  = q.split("=",2)

		# URL デコードを行い連想配列に格納
		request_param[k] = CGI.unescape(v);
	end
end

#!/usr/local/bin/ruby

# POSTメソッドであるか調べる
if (ENV['REQUEST_METHOD'] == "POST") {

}

#!/usr/local/bin/ruby


# ライブラリをロード
require 'cgi'

# パラメータを格納する為の連想配列
request_param = Hash.new

# POSTメソッドであるか調べる
if ENV['REQUEST_METHOD'] == "POST" then

	# 標準入力からパラメータを取得する
	query = STDIN.read(ENV['CONTENT_LENGTH'].to_i)

	# "&" で区切る
	for q in query.split("&") do
		# "=" で区切る
		k, v  = q.split("=",2)

		# URL デコードを行い連想配列に格納
		request_param[k] = CGI.escape(v);
	end
end

#!/usr/local/bin/ruby

# Content-type を出力
print "Content-Type: text/plain\n"

# 改行のみでヘッダの終了
print "\n"

# パラメータを出力
print "Hallo World!!"

#!/usr/local/bin/ruby

# Content-type を出力
print "Content-Type: text/html\n"

# 改行のみでヘッダの終了
print "\n"

# HTML 文字列をヒアドキュメントで出力
print <<EOF
<html>
<body>
	<b>Hallo World!!<b>
</body>
</html>
EOF

#!/usr/local/bin/ruby

# Content-type を出力
print "Content-Type: application/x-www-form-urlencoded\n"

# 改行のみでヘッダの終了
print "\n"

# 変数
user = "hanako"
age = 16
blood = "o"

# パラメータを出力
print "user=" + user
print "&"
print "age=" + age.to_s
print "&"
print "blood=" + blood

#!/usr/local/bin/ruby

# Content-type を出力
print "Content-Type: application/json\n"

# 改行のみでヘッダの終了
print "\n"

# 変数
user = "hanako"
age = 16
blood = "o"

# パラメータを出力
print "{"
print "\"user\":\"" + user + "\","
print "\"age\":" + age.to_s + ","
print "\"blood\":\"" + blood + "\""
print "}"

#!/usr/local/bin/python
# coding: utf-8


# ライブラリをロード
import os

# GETメソッドであるか調べる
if os.getenv('REQUEST_METHOD') == "GET" :
	print "GET METHOD"

#!/usr/local/bin/python
# coding: utf-8


# ライブラリをロード
import os
import urllib

# パラメータを格納する為の連想配列
request_param = dict()

# GETメソッドであるか調べる
if os.getenv('REQUEST_METHOD') == "GET" :

	# URL の ? 以降の文字列を取得する
	query = os.getenv('QUERY_STRING')

	# "&" で区切る
	for q in query.split('&') :
		# "=" で区切る
		k, v  = q.split("=",2)

		# URL デコードを行い連想配列に格納
		request_param[k] = urllib.unquote(v)
	

#!/usr/local/bin/python
# coding: utf-8


# ライブラリをロード
import os

# POSTメソッドであるか調べる
if os.getenv('REQUEST_METHOD') == "POST" :
	print "POST METHOD"

#!/usr/local/bin/python
# coding: utf-8


# ライブラリをロード
import os
import sys
import urllib

# パラメータを格納する為の連想配列
request_param = dict()

# POSTメソッドであるか調べる
if os.getenv('REQUEST_METHOD') == "POST" :

	# 標準入力からパラメータを取得する
	query = sys.stdin.read(int(os.getenv('CONTENT_LENGTH')))

	# "&" で区切る
	for q in query.split('&') :
		# "=" で区切る
		k, v  = q.split("=",2)

		# URL デコードを行い連想配列に格納
		request_param[k] = urllib.unquote(v)
	

#!/usr/local/bin/python
# coding: utf-8


# ライブラリをロード
import sys

# Content-type を出力
sys.stdout.write("Content-Type: text/plain\n\n")

# パラメータを出力
sys.stdout.write("Hallo World!!")

#!/usr/local/bin/python
# coding: utf-8


# ライブラリをロード
import sys

# Content-type を出力
sys.stdout.write("Content-Type: text/html\n\n")

# HTML 文字列をトリプルクォートで囲んで出力
sys.stdout.write("""
<html>
<body>
	<b>Hallo World!!<b>
</body>
</html>
""")

#!/usr/local/bin/python
# coding: utf-8


# ライブラリをロード
import sys

# Content-type を出力
sys.stdout.write("Content-Type: application/x-www-form-urlencoded\n\n")

# 変数
user = "hanako"
age = 16
blood = "o"

# パラメータを出力
sys.stdout.write("user=" + user)
sys.stdout.write("&")
sys.stdout.write("age=" + str(age))
sys.stdout.write("&")
sys.stdout.write("blood=" + blood)

#!/usr/local/bin/python
# coding: utf-8


# ライブラリをロード
import sys

# Content-type を出力
sys.stdout.write("Content-Type: application/json\n\n")

# 変数
user = "hanako"
age = 16
blood = "o"

# パラメータを出力
sys.stdout.write("{")
sys.stdout.write("\"user\":\"" + user + "\",")
sys.stdout.write("\"age\":" + str(age) + ",")
sys.stdout.write("\"blood\":\"" + blood + "\"")
sys.stdout.write("}")

window.ExternalCallback = function (param){

	console.log("通信が完了した:" + param);

};

// HTMLScriptElement オブジェクトを作成する
var script = document.createElement("script");

// CGI の URL アドレスをセット
script.src = "http://example.com/api/test.cgi";

// CGI の URL アドレスをセット
script.src = "http://example.com/api/test.cgi?user=taro&age=18&blood=b";

// CGI の URL アドレスをセット
script.src = "http://example.com/api/test.cgi?callback=ExternalCallback";

// ------------------------------------------------------------
// 受信用のグローバルなコールバック関数
// ------------------------------------------------------------
window.ExternalCallback = function (param){

	console.log("通信が完了した:" + param);

};

// ------------------------------------------------------------
// HTMLScriptElement オブジェクトを作成する
// ------------------------------------------------------------
var script = document.createElement("script");

// ------------------------------------------------------------
// CGI の URL アドレスをセット
// ------------------------------------------------------------
script.src = "http://example.com/api/test.cgi?callback=ExternalCallback";

// ------------------------------------------------------------
// BODY 要素のノードリストに登録する（通信開始）
// ------------------------------------------------------------
document.body.appendChild(script);

{"a":0,"b":1,"c":2}

ExternalCallback( {"a":0,"b":1,"c":2} );

// ------------------------------------------------------------
// クエリー
// ------------------------------------------------------------
var query = "https://hakuhin.jp/js.html";

// ------------------------------------------------------------
// HTMLScriptElement オブジェクトを作成する
// ------------------------------------------------------------
var script = document.createElement("script");

// ------------------------------------------------------------
// 受信用コールバック用関数を生成
// ------------------------------------------------------------
window.ExternalCallback = function (param){

	// ------------------------------------------------------------
	// HTMLScriptElement オブジェクトをノードリストから除外する
	// ------------------------------------------------------------
	if(script.parentNode){
		script.parentNode.removeChild(script);
	}

	// ------------------------------------------------------------
	// 受信用コールバック関数を破棄する
	// ------------------------------------------------------------
	try{
		delete window.ExternalCallback;
	}catch(e){
		window.ExternalCallback = null;
	}

	// ------------------------------------------------------------
	// 出力テスト
	// ------------------------------------------------------------
	console.log(param);
};

// ------------------------------------------------------------
// CGI の URL アドレスをセット
// ------------------------------------------------------------
script.src = 'http://b.hatena.ne.jp/entry/jsonlite/?url=' + encodeURIComponent(query) + '&callback=ExternalCallback';

// ------------------------------------------------------------
// BODY のノードリストに登録する（通信開始）
// ------------------------------------------------------------
document.body.appendChild(script);

// ------------------------------------------------------------
// 検索したいクエリーリスト
// ------------------------------------------------------------
var query_list = [
	"https://hakuhin.jp/as.html",
	"https://hakuhin.jp/as3.html",
	"https://hakuhin.jp/js.html"
];

// ユニーク ID
var unique_id = 0;

var i;
var num = query_list.length;
for(i=0;i < num;i++){

	// クエリー
	var query = query_list[i];

	// 匿名関数内で実行
	(function(){

		// ------------------------------------------------------------
		// ユニーク（唯一）な名前を用意
		// ------------------------------------------------------------
		var callback_name = "ExternalCallback_" + unique_id;
		unique_id ++;

		// ------------------------------------------------------------
		// HTMLScriptElement オブジェクトを作成する
		// ------------------------------------------------------------
		var script = document.createElement("script");

		// ------------------------------------------------------------
		// 受信用コールバック用関数を生成
		// ------------------------------------------------------------
		window[callback_name] = function (param){

			// ------------------------------------------------------------
			// HTMLScriptElement オブジェクトをノードリストから除外する
			// ------------------------------------------------------------
			if(script.parentNode){
				script.parentNode.removeChild(script);
			}

			// ------------------------------------------------------------
			// 受信用コールバック関数を破棄する
			// ------------------------------------------------------------
			try{
				delete window[callback_name];
			}catch(e){
				window[callback_name] = null;
			}

			// ------------------------------------------------------------
			// 出力テスト
			// ------------------------------------------------------------
			console.log(param);
		};

		// ------------------------------------------------------------
		// CGI の URL アドレスをセット
		// ------------------------------------------------------------
		script.src = 'http://b.hatena.ne.jp/entry/jsonlite/?url=' + encodeURIComponent(query) + '&callback=' + callback_name;

		// ------------------------------------------------------------
		// BODY のノードリストに登録する（通信開始）
		// ------------------------------------------------------------
		document.body.appendChild(script);

	})();

}

Access-Control-Allow-Origin: *

// XDomainRequest をサポートしている
if(window.XDomainRequest){

	// ------------------------------------------------------------
	// XDomainRequest オブジェクトを作成する
	// ------------------------------------------------------------
	var xdr = new XDomainRequest();

	// ------------------------------------------------------------
	// 通信に成功すると実行されるイベント
	// ------------------------------------------------------------
	xdr.onload = function (){
		// コンテンツタイプを取得する
		console.log(xdr.contentType );

		// レスポンスボディを取得する
		console.log(xdr.responseText );
	};

	// ------------------------------------------------------------
	// 通信に失敗すると実行されるイベント
	// ------------------------------------------------------------
	xdr.onerror = function (){

	};

	// ------------------------------------------------------------
	// 通信中に繰り返し実行されるイベント
	// ------------------------------------------------------------
	xdr.onprogress = function (){

	};

	// ------------------------------------------------------------
	// タイムアウトが発生すると実行されるイベント
	// ------------------------------------------------------------
	xdr.ontimeout = function (){

	};

	// ------------------------------------------------------------
	// タイムアウトと判断する時間を設定する（単位：ミリ秒）（デフォルトは 0）
	// ------------------------------------------------------------
	xdr.timeout = 0;

	// ------------------------------------------------------------
	// 「HTTP メソッドを指定する」「アクセス先 URL を指定する」
	// ------------------------------------------------------------
	var method = "POST";
	var url = "http://example.com/test.cgi";
	xdr.open( method , url );

	// ------------------------------------------------------------
	// 「送信データを指定する」「通信を開始する」
	// ------------------------------------------------------------
	var send_data = "Hello World !!";
	xdr.send( send_data );

	// ------------------------------------------------------------
	// 「通信を中止する」
	// ------------------------------------------------------------
	// xdr.abort();

}