プログラム学習室 http://studyhallweb.com/

Dart言語: HttpRequest

JSON File の読み込み

まずは次のURLのサンプルの確認から。
参照: Dart: Up and Running

HttpRequest.getString(uri).then(processString); で、uri にあるテキスト(JSON)を読み込み、then()のファンクションに渡しています。

JSON File の内容は次のとおり。

[
  {"score": 40},
  {"score": 80}
]
					

Dartプログラム

import 'dart:html';
import 'dart:convert';

var uri = 'test023.json';  // JSON fiile

main() {

  // Read a JSON file.
  HttpRequest.getString(uri).then(processString);

}

processString(String jsonText) {
  String addHtml;

  var scores = JSON.decode(jsonText);
  addHtml = '全体: ' + scores.toString() + '<br/>';
  var score1 = scores[0];
  addHtml += '初めのオブジェクト: ' + scores[0].toString() + '<br/>';
  addHtml += 'score の値: ' + score1['score'].toString() + '<br/>';

  Element tag = querySelector('#output1');
  tag.appendHtml(addHtml);
}					 	

読み込んだ内容は配列として扱えます。
ここでは、"全体"、"初めのオブジェクト"、"score の値" として表示しています。

読み込み結果

(これが表示されたら Dartium で見てください)

XML File 読み込み

次は XMLファイルの読み込みです。参照は JSON と同じ Up and Running のページです。
参照: Dart: Up and Running

XMLファイルの内容

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE data[
  <!ELEMENT data (homepage+)>
  <!ELEMENT homepage (title, URL, author)>
  <!ELEMENT title (#PCDATA)>
  <!ELEMENT URL (#PCDATA)>
  <!ELEMENT author (#PCDATA)>
]>
<data>
  <homepage>
    <title>プログラム学習室</title>
    <URL>http://studyhallweb.com/</URL>
    <author>hi_tag</author>
  </homepage>
  <homepage>
    <title>プログラム学習室(書庫)</title>
    <URL>http://www001.upp.so-net.ne.jp/studyhall/</URL>
    <author>hi_tag</author>
  </homepage>
</data>
				

DTDの書式については、buzzword http://www.webword.jp/xml/dtd/index3.html の記事分かりやすいです。
XMLの検証は Markup Validation Service

Dartプログラム

import 'dart:html';
import 'dart:convert';

var xmlUri = 'test023.xml';  // XML file

main() {
  HttpRequest.request(xmlUri)
      .then(processRequest)
      .catchError(handleError);
}


// XML file 読み込みのプロセス
processRequest(HttpRequest request) {
  var xmlDoc = request.responseXml;
  try {
    // querySelector() だと一つ目の要素がヒットする
    var author = xmlDoc.querySelector('author').text;    // .text で値を取得
    Element tag = querySelector('#output2');
    tag.appendHtml('autohr: ' + author + '<br/>');

    // querySelectorAll() で複数の値をゲットする
    List<Element> urls = xmlDoc.querySelectorAll('URL');
    // forEach で個々の値を取得
    urls.forEach((url) {
      tag.appendHtml(url.toString() + ':' + url.text + '<br/>');
    });
  } catch(e) {
    print('$xmlUri doesn\'t have correct XML formatting.');
  }
}

// 読み込みエラー時の処理
handleError(error) {
  print('Uh oh, there was an error.');
  print(error.toString());
}
					

XMLファイルの読み込みは HttpRequest.request(uri) を使います。
読み込んだ後は、DOMの扱いになります。
複数ある要素に対しては ququerySelectorAll() を使い、forEach で個々の要素を処理します。

読み込み結果

(これが表示されたら Dartium で見てください)

注意事項

HttpRequest ですので当然ですが、サーバー上でないと動作しません。
ローカルのHTMLファイルを直接ブラウザから読み込んで起動した場合は、JSON や XML は読み込まれません
それに気付かず数時間無駄にしました...。