http(s)でマルチバイト(UTF-8)をGETリクエストする方法
ここ1週間、httpで漢字(UTF-8)をリクエストする方法を探して、コーディング&デバッグをしていました。本日、ようやく成功したので、報告します。結論から言うと、Windows版curl(Ver.7.33.09)では、実行できず、htmlの中からJavaScriptでXMLHttpRequest()を実行します。
1.htmlの中では、HTML5対応で宣言します。
2.XMLhttpRequestオブジェクトを作成します。
オブジェクト名がXMLhttpRequestとありますが、Text(文字列)にも対応しています。また、httpプロトコルだけではなく、httpsも実行可能でした。
3.openメソッドでリクエストを初期化します。
サンプルでは、第3引数を省略していますが、第3引数でtrue(非同期通信)/false(同期通信)の設定が可能です。また、第4、第5引数でユーザ名とパスワードの設定も可能です。
4.setRequestHeaderプロパティでcharsetをUTF-8に設定します。
firefoxでは、この設定を省略しても実行できましたが、IE11ではこの設定がないと、前回(現在)使用したcharsetで動作するようです。
5.sendプロパティでリクエストを送信します。
onreadystatechangeプロパティを使用して、ステータスが変更したイベントが発生したら、statusプロパティの帰り値をみて、sendを実行したかったのですが、firefoxでは、onreadystatechangeが、うまく動作できませんでした。IEではonreadystatechangeはちゃんと動作しました。firefoxでは、どうやら非同期通信ではなく同期通信で実行されているようです。
6.responseTextプロパティでhttpサーバからのデータを取得します。XMLデータで取得したい場合には、responseTextの代わりにresposeXMLを使用します。ただし、データの型はDocumentタイプとなります。
以下は、サンプルです。
<div id="output"></div>
<script type="text/javascript">
xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET","http://URL名");
xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=UTF-8")
output.innerHTML += xmlhttp.status;
xmlhttp.send();
output.innerHTML += xmlhttp.status;
var strData = xmlhttp.responseText;
output.innerHTML = strData;
</script>
-------------------------------------------
2016/5/22追記
IE11で実行する時には、こちらのオプション設定が必要です。
-------------------------------------------
curlでは、マルチバイト対応として以下のオプションが用意されていますが、説明にあるとおり、
POSTリクエスト時のみで、GETリクエストに対応するオプションがありません。curlオプションも実際に試していますが、失敗しました。
--form CONTENT Specify HTTP multipart POST data (H)
--form-string STRING Specify HTTP multipart POST data (H)
--data-binary DATA HTTP POST binary data (H)
--data-urlencode DATA HTTP POST data url encoded (H)
あと、当然ながら、IEなど、古い(Ver.11以前)バージョンでは、動作しません。
参照サイト:
サーバから非同期にレスポンスを受け取る方法 (Ajax) | JavaScript プログラミング解説
参考文献:
Java Script辞典 HTML5対応 第4版 著者:(株)アンク
今日もがじがじっと~♪