Как записать в HTML-элемент с сервера в Dart

#forms #server #dart #request #response

#формы #сервер #dart #запрос #ответ

Вопрос:

Я пытаюсь изучить основы Dart на стороне сервера. Когда я нажимаю элемент отправки на HTML-странице, экран очищается и заменяется на «привет». Я пытаюсь сохранить все элементы на месте и поместить «привет» в div место. Я не нашел никакой базовой документации по этому вопросу, поэтому, возможно, мне здесь многого не хватает. Есть ли простой способ сделать это?

Вот код сервера:

 import 'dart:io';

Future main() async {
  var server = await HttpServer.bind(
    InternetAddress.loopbackIPv4,
    8080,
  );

  await for (HttpRequest request in server) {
request.response
  ..write("hello")
  ..close();
  }
}

Вот HTML:

 <form action="http://localhost:8080" method="GET">
<input type="text" id="name" value="name">
<input type="submit" value="submit">
</form>
<div id="output"></div>  // I want the "hello" to go here

1. Вы видели этот пример: webdev.dartlang.org/tutorials/get-data/fetch-data ?

2. Состоит из нескольких задач. Что-то вроде a) отправить http get от клиента (код выше). б) получить http get на сервере (код выше). c) отправить ответ с сервера (код выше). d) получение на клиенте. e) отобразить полученные данные в элементе dom. Шаги a, b, c d могут быть проверены с помощью таких вещей, как chrome dev tools или просто простые инструкции печати. Соответствует ли это вашему проекту?

3. ДА. Я согласен с шагами, но не могу добраться до d и e. Я думаю, ясно, что это должно быть сделано с помощью dart-кода в клиенте. Это помогает само по себе. Я просто не могу найти ни одного примера того, как заставить вышеупомянутое работать. Я думаю, что это как-то связано с изменением настроек на стороне сервера, но опять же, это неясно.

Ответ №1:

Довольно часто создаются веб-приложения, которые извлекают данные из других веб-приложений, инициируемые логикой, которая выполняет HTTP-вызовы сторонних служб.

давайте посмотрим, как мы можем использовать встроенные классы HttpRequest для выполнения HTTP-вызовов внешних служб.

index.html

 <!DOCTYPE html>
<html>
  <head>
    <title>A Minimalist App</title>
  </head>

  <body>
     <div id="output">Hi</div>  // I want the "hello" to go here
    <script type="application/dart" src="main.dart"></script>
    <script src="packages/browser/dart.js"></script>
  </body>
</html>

main.dart

 import 'dart:html';
void main() {
  var response = await HttpRequest.getString('http://localhost:8080')
  querySelector('#output').text = response;
}

Для получения дополнительной информации посетите здесь

Спасибо. , надеюсь, это поможет.

1. Спасибо. Это очень полезно, но не отвечает на вопрос. В частности, я пытаюсь изучить поведение элемента формы и то, как он может взаимодействовать с сервером, если это возможно. Возможно, у меня фундаментальное непонимание элемента формы. Ваш пример был полезен, но он не работает полностью. Происходит то, что ответ отправляется элементу div, но затем экран меняется, и ответ появляется на новой странице все вместе.