JSON im Webbrowser aufrufen und anzeigen

Ich versuche, die JSON-Informationen im Webbrowser anzuzeigen, um sicherzustellen, dass ich darauf zugreifen kann.JSON im Webbrowser aufrufen und anzeigen

Die JSON ist im Format

[ 
    { 
    "ts": "2016-10-10T04:40:06.567000", 
    "sensor_value": 9.7827 
    }, 
    { 
    "ts": "2016-10-10T04:40:16.613000", 
    "sensor_value": 9.80362 
    }, 
    { 
    "ts": "2016-10-10T04:40:26.660000", 
    "sensor_value": 9.80722 
    }, 
    { 
    "ts": "2016-10-10T04:40:36.600000", 
    "sensor_value": 9.77777 
    }, 
    { 
    "ts": "2016-10-10T04:40:46.643000", 
    "sensor_value": 9.79755 
    }, 
    { 
    "ts": "2016-10-10T04:40:56.580000", 
    "sensor_value": 9.91404 
    } 
]

ich folgende html bin mit den Objekte als ein

<html> 
<head> 
<script type="text/javascript" 
src="http://code.jquery.com/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(function(){ 
     $.getJSON('CLEVERTITLE.json',function(data){ 
      console.log('success'); 
      $.each(data,function(index,data){ 
       console.log("entered each") 
       $('ul').append('<li>'+data.ts+' ' 
           +data.sensor_value+'</li>'); 
      }); 
     }).error(function(){ 
      console.log("ERROR") 
     }); 
    }); 
</script> 
</head> 
<body> 
    <ul></ul> 
</body> 
</html>

Ich bin mit Knoten Live-Server 'ul' zu testen und zeigen, aus dem Verzeichnis, um auf die Dateien über localhost:8080 zuzugreifen.

Allerdings läuft mir das nur eine Kugel mit Text "undefined undefined". Ich hoffe, 2016-10-10T04:40:46.643000 9.7777 zu zeigen. Wenn ich auf die Tags "ts" und "sensor_value" zugreifen könnte, könnte das in Zukunft nützlich sein. Es tut mir leid, wenn das sehr einfach ist.

###########

EDIT: Es stellte sich heraus, das Problem war die Menge der Daten. Ich habe versucht, über eine Million Datenpunkte zu zeigen. Als ich den Betrag auf eine vernünftigere Zahl reduzierte, funktionierte das richtig. Danke an alle, die geantwortet haben.

Quelle

2017-04-14 Anthony Mujica

Können Sie bestätigen, dass der HTML-Code auf Ihre JSON-Datei zugreifen kann? –

Sie haben die Daten in der Frage wahrscheinlich falsch dargestellt, sonst würden Sie überhaupt keine Ausgabe erhalten. –

Ich nehme an, Ihre Daten sind eigentlich so etwas wie '{data: [{---}, {---}, {- -}]} ', was die einzelne Iteration mit' undefined, undefined' für ein Ergebnis erklären würde. –

Ihr JSON ist ungültig. Die äußere Struktur sollte kein Objekt sein ({}), sondern ein Array ([]). Ein Objekt enthält eine Reihe von Schlüssel/Wert-Paaren, während ein Array eine Liste von Werten enthält.

Correct wie folgt:

[ 
    { 
    "ts": "2016-10-10T04:40:06.567000", 
    "sensor_value": 9.7827 
    }, 
    { 
    "ts": "2016-10-10T04:40:16.613000", 
    "sensor_value": 9.80362 
    }, 
    { 
    "ts": "2016-10-10T04:40:26.660000", 
    "sensor_value": 9.80722 
    }, 
    { 
    "ts": "2016-10-10T04:40:36.600000", 
    "sensor_value": 9.77777 
    }, 
    { 
    "ts": "2016-10-10T04:40:46.643000", 
    "sensor_value": 9.79755 
    }, 
    { 
    "ts": "2016-10-10T04:40:56.580000", 
    "sensor_value": 9.91404 
    } 
]

Quelle

2017-04-14 02:51:44

Entschuldigung, ich habe nur ein paar der Werte, die die tatsächliche Datei hat, an der Außenseite []. Ich habe hier einen Fehler gemacht. –

Ich habe den Originaltext aktualisiert –

Ihre JSON-Datei wie folgt sein sollte:

[ 
    { 
    "ts": "2016-10-10T04:40:06.567000", 
    "sensor_value": 9.7827 
    }, 
    { 
    "ts": "2016-10-10T04:40:16.613000", 
    "sensor_value": 9.80362 
    }, 
    { 
    "ts": "2016-10-10T04:40:26.660000", 
    "sensor_value": 9.80722 
    }, 
    { 
    "ts": "2016-10-10T04:40:36.600000", 
    "sensor_value": 9.77777 
    }, 
    { 
    "ts": "2016-10-10T04:40:46.643000", 
    "sensor_value": 9.79755 
    }, 
    { 
    "ts": "2016-10-10T04:40:56.580000", 
    "sensor_value": 9.91404 
    } 
]

Auch <!DOCTYPE html> vor Ihrem <html>-Tag hinzufügen oder sonst würde es die folgende Warnung in Ihrem Browser Konsole geben.

HTML1527: DOCTYPE expected. Consider adding a valid HTML5 doctype: "<!DOCTYPE html>".

Quelle

2017-04-14 03:16:08 Chip

Wie unterscheidet sich das von dem, was in der Frage ist? –

JSON im Webbrowser aufrufen und anzeigen

Antwort

Verwandte Themen