1

クライアント側で処理できるラウンドトリップなしで、HTMLページいくつかのjsonをクライアントに提供したいと思います。これは可能ですか?これを行う最善の方法は何ですか?ヘッダーで送信することを検討しましたが、一部の人は眉をひそめているようです。どんな例でも大歓迎です。疑似コード:

main(){
  ...
  app.addRequestHandler((req) => req.path == '/user', handler);
}

void handler(req, res) {
  var file = new File(myHtmlFile);
  res.headers.set(...); //add json here?
  res.outputstream...   //or here?
  ...
  stream.pipe(res.outputStream);
}
4

1 に答える 1

2

HTMLファイルに、応答として送信する前に置き換えるタグを配置できます。

たとえば、htmlファイルでは:

<!DOCTYPE html>
<html>
<head>
  <title>Test</title>
</head>
<body>
  <input type='hidden' id='datas' value="___JSON_DATAS___"/>
  ...
</body>
</html>

___JSON_DATAS___サーバー内で次のようなものに置き換えられます:

void handler(req, res) {
  var file = new File(myHtmlFile);
  readStreamAsString(file.openInputStream()).then((fileContent) {
    final content = fileContent
        .replaceAll("___JSON_DATAS___", htmlEscape(jsonAsString));
    res.outputStream.writeAsString(content);
    res.outputStream.close();
  });
}

String htmlEscape(String text) {
  return text.replaceAll("&", "&amp;")
      .replaceAll("<", "&lt;")
      .replaceAll(">", "&gt;")
      .replaceAll('"', "&quot;")
      .replaceAll("'", "&apos;");
}

Future<String> readStreamAsString(InputStream stream) {
  final completer = new Completer();
  final sb = new StringBuffer();
  final sis = new StringInputStream(stream);
  sis
    ..onData = () { sb.add(sis.read()); }
    ..onClosed = () { completer.complete(sb.toString()); }
    ..onError = (e) { completer.completeException(e); };
  return completer.future;
}

次に、クライアント側で:

import 'dart:html';
import 'dart:json';

main(){
  final input = query('#datas') as InputElement;
  final datas = JSON.parse(input.value);
  //...
}
于 2012-12-12T14:49:51.117 に答える