Wyszukiwanie w witrynie

javascript - Uzyskiwanie dostępu do częściowej odpowiedzi za pomocą AJAX lub WebSockets?

Używam pewnego kodu JavaScript po stronie klienta, aby pobrać dużo danych JSON z serwera WWW za pomocą żądania HTTP GET. Ilość danych może być duża, powiedzmy 50 MB. To jest w sieci lokalnej, więc nie stanowi to dużego problemu, ale i tak zajmuje to około dziesięciu sekund.

Aby moja interfejs był bardziej responsywny, chciałbym przetwarzać odpowiedź w kawałkach, wyświetlając dane w interfejsie użytkownika, gdy tylko staną się dostępne (powiedzmy, na MB lub na sekundę). Kompatybilność przeglądarek nie jest problemem; dopóki działa na najnowszym Chrome i Firefox, będzie w porządku. Jednak nie mogę modyfikować kodu serwera.

Czy możliwe jest zrobienie tego za pomocą XMLHttpRequest, WebSockets lub jakiejś innej technologii, o której nie słyszałem?

XMLHttpRequest.responseText nie jest jawnie pusty, gdy stan to LOADING:

Atrybut responseText musi zwracać wynik wykonania tych kroków:

  1. Jeśli stan nie jest LOADING ani DONE, zwróć pusty ciąg i zakończ te kroki.
  2. Zwróć ciało encji odpowiedzi tekstowej.

Ale przypuszczam, że buforowanie będzie miało miejsce na różnych etapach, więc czy zadziała, jeśli ustawiam timer, aby okresowo sprawdzać responseText?

O ile mogę stwierdzić, WebSockety wymagają również specjalnego protokołu po stronie serwera, więc te odpadają.

Ograniczenie: Nie mogę modyfikować kodu serwera.

Odpowiedź #1

Chciałem to opublikować jako komentarz, ale pole tekstowe komentarza jest trochę ograniczające

Czy serwer wysyła dane w kawałkach w danym momencie, czy jest to jeden ciągły strumień? Jeśli dodasz obsługę do xmlHttpRequestInstance.onreadystatechange, jak często jest ona wywoływana? Jeśli xmlHttpRequestInstance.readystate ma wartość 3, możesz uzyskać bieżącą wartość xmlHttpRequestInstance.responseText i śledzić jej długość. Następnym razem, gdy zmieni się readystate, możesz uzyskać najnowsze dane, pobierając wszystkie nowe dane zaczynając od tego punktu.

Nie testowałem poniższego, ale mam nadzieję, że jest wystarczająco jasne:

var xhr = new XMLHttpRequest();
var lastPos = 0;
xhr.onreadystatechange = function() {
  if(xhr.readystate === 3) {
    var data = xhr.responseText.substring(lastPos);
    lastPos = xhr.responseText.length;

    process(data);
  } 
};
// then of course do `open` and `send` :)

To oczywiście opiera się na wywołaniu zdarzenia onreadystatechange. To będzie działać w IE, Chrome, Safari i Firefox.