Подпишитесь на данные чанкованных строк из Node, используя Angular observables для их отображения, как только чанки будут доставлены - PullRequest
Новая
       51

Подпишитесь на данные чанкованных строк из Node, используя Angular observables для их отображения, как только чанки будут доставлены

0 голосов
/ 06 декабря 2018

Справочная информация : Angular рекомендует для разработки приложений наблюдаемые объекты - они отличаются от обещаний, потому что обещания выполняются при разрешении или отклонении (одно событие), тогда как наблюдаемые могут обрабатывать поток данных (несколько событий).Мой вопрос не в том, чтобы выбрать одно из другого, а в том, чтобы прочитать поток данных из NodeJS.

Копая глубже в наблюдаемом, мы видим наблюдаемое чтение из потока событий, потока данных, генерируемых на стороне клиента (массива формы, в setInterval) и т. д. Мой вопрос касается наблюдаемых (издатель - модель подписчика), используемых для подписки на бэкэнд узла JJ / expressJS, который будет здесь издателем - который отправляет простой файл res.write с фиксированным интервалом.

То, что я пробовал и что случилось ... когда мы используем observable с этим генерируемым потоком строковых данных, результаты отображаются только после завершения бэкэнда ... наблюдаемый вызовоставил висеть ...

Что бы я хотел, чтобы произошло? с использованием Angular и наблюдаемых, каким будет способ подписаться на эти данные и показать их (на стороне клиента) каки когда он генерируется (на стороне сервера)

код на стороне сервера с использованием NodeJS / Express JS 

app.get('/obs/responseWriteNEW', cors(), function(req, res) {
  var completedWrite = false;
  try {

    var j = 0;
    const headers = {
      'Content-Type': 'text',
      'Access-Control-Allow-Origin': '*',
      'Access-Control-Allow-Methods': 'OPTIONS, POST, GET',
      'Access-Control-Max-Age': 2592000, // 30 days
    };
    res.writeHead(200, headers);

    var i = 0;
    setInterval(function() {
      if (i < 100) {
        var myObj = {
          responseWriteNEW: i
        };
        var myStr = JSON.stringify(myObj);
        console.log(myStr);
        res.write(myStr);
        i++;
      } else {
        res.end();
      }
    }, 250);

  } catch (expp) {
    console.log(expp);
  }

});

код на стороне клиента https://stackblitz.com/edit/angular-44sess

с использованием vanilla-JS , мы получили первый кусок данных, напечатанный после длиныпотоковые данные превысили 1030. 

xhr = new XMLHttpRequest();
xhr.addEventListener("progress", function(ev) {  console.log(ev.target.responseText); $("#ajaxLog").append(ev.target.responseText); });
xhr.open("GET", 'http://localhost:2025/obs/responseWriteNEW');
xhr.send();
...