Zu Handbuch Javascript-API

Golem.Api.Special.Article – Liste der neuen Artikel einer Special-Kategorie holen

Mit der Klasse Golem.Api.Special.Article laden Sie eine Liste der neuen Artikel einer Special-Kategorie auf Golem.de.

Inhalt

Einbindung

Javascript-Datei Golem/Api/Special/Article.js
Golem/Api/Special/Article-min.js
Package-Javascript-Datei Golem/Api/Special-full.js
Golem/Api/Special-full-min.js
Erforderliche Klassen Golem.Request
Golem.Api
<!-- Erforderlich -->
<script type="text/javascript" src="http://api.golem.de/download/js/latest/Golem/Core-min.js"></script>

<!-- Klasse -->
<script type="text/javascript" src="http://api.golem.de/download/js/latest/Golem/Api/Special/Article.js"></script>

Verwendung

Einfache Variante

Nehmen wir an, Sie wollen in einer leeren HTML-Liste die neusten fünf Artikel einer Special-Kategorie auf Golem.de anzeigen. Der HTML-Code der Liste sieht wie folgt aus:

<ul id="articlelist">
</ul>
Beispiel 1: Leere HTML-Liste

Der zugehörige Javascript-Code soll diese Liste mit den Überschriften und Abstracts der Artikeln füllen. Dem Construktor der Klasse Golem.Api.Special.Article übergeben Sie den Kurznamen der Kategorie und die Anzahl der gewünschten Artikel. Anschliessend rufen Sie die fetchEach()-Methode des Objektes auf. Als Parameter für den Aufruf wird eine Funktion übergeben, die für jeden Artikeleintrag aufgerufen wird.

Golem.Request.KEY = '<ENTWICKLERSCHLÜSSEL>';

var request = new Golem.Api.Special.Article( 'linux', 5);

request.fetchEach(addItem);
Beispiel 2: Abfrage für die 5 neuesten Artikel der Kategorie 'linux'

Unserer Methode zum Einfügen eines Listeneintrages wird ein Objekt-Literal übergeben mit den Artikeldaten als Eigenschaften des Objektes.

function addItem(article) {

 var elList = document.getElementById('articlelist');

 var elItem = document.createElement('LI');

 elItem.innerHTML = "<h2>" + article.headline + "</h2>" +
                    "<p>" + article.abstracttext + "</p>";

 elList.appendChild(elItem);

}
Beispiel 3: Funktion zum Füllen der HTML-Liste

Andere Zugriffsformen

Die oben verwendete Methode fetchEach() ist eine vereinfachte Kombination der Methoden fetch() zum Holen der Daten und each() zum Durchlaufen. Wenn Sie Fehler bei der Datenabfrage abfangen wollen oder müssen, geht das nur bei der Verwendung von fetch().

Sie übergeben fetch() ein Objekt-Literal mit der Eigenschaft fnSuccess, der Sie eine entsprechende Funktion zuweisen:

request.fetch(
  {
    fnSuccess : fillList
  }
);
Beispiel 4: Abfrage mit fetch()

Innerhalb der Füll-Funktion können Sie die each()-Methode aufrufen. Die Füll-Funktion läuft dabei innerhalb des Scopes des request-Objektes, weshalb Sie each() über this referenzieren können. Als Parameter übergeben Sie der Methode eine Funktion, die für jeden zurückgelieferten Artikel aufgerufen wird.


function fillList() {

    this.each(addItem);

}
Beispiel 5: Funktion zur Auswertung der Ergebnisse

Wenn Sie lediglich die Artikeleinträge benötigen, ohne sie gleich zu durchlaufen, können Sie auch die Methode getData() benutzen. Sie liefert alle Artikeleinträge in einem Array zurück.

Fehlerbehandlung

Während der Datenabfrage können Fehler auftreten:

  • Golem.Api.Article.Latest.ERROR_LIMIT bedeutet, dass die angeforderte Länge der meistgelesenen Artikel entweder zu klein ist (kleiner als 1) oder zu groß. Derzeit beträgt der größtmögliche Wert 50.

Um eine fehlerhafte Abfrage abzufangen, geben Sie bei der Methode fetch() eine Funktion für die Fehlerbehandlung an:

...
request.fetch(
    {
        fnSuccess : fillList,
        fnError   : handleError
    }
);
...
Beispiel 6: Abfrage ergänzt um die Fehlerbehandlung

Der Fehler-Funktion wird als erster Parameter der Fehlercode übergeben, als zweiter eine Fehlermeldung. Auch diese Funktion läuft innerhalb des Scopes des request-Objektes.


function handleError(errorCode, errorMessage) {

    var msg = '';

    switch(errorCode) {

        case Golem.Api.Special.Article.ERROR_LIMIT :
            msg = 'Es wurden zu wenig oder zu viel Einträge angefordert';
            break;

        case Golem.Api.Special.Article.ERROR_NOT_SPECIAL :
            msg = 'Die Kategorie ist unbekannt!';
            break;


        default :
            msg = 'Unbekannter Fehler!';
    }
    
    alert(msg);

}
Beispiel 7: Funktion zur Fehlerbehandlung

Verfügbare Artikeldaten

Für jeden Artikel werden folgende Eigenschaften mitgeliefert:

Name Bedeutung
articleid Artikel-Identifier
abstracttext Der Abstract des Artikels, eine Kurzzusammenfassung des Inhaltes
headline Die Überschrift des Artikels
date Das Veröffentlichungsdatum als UNIX-Timestamp in Millisekunden
url Die URL des Artikels
leadimg Ein Objekt-Literal mit den Daten des Headline-Bildes des Artikels. Die Eigenschaften des Objektes umfassen:
  • leadimg.url – Die URL des Bildes
  • leadimg.width – Die Breite des Bildes in Pixel
  • leadimg.height – Die Höhe des Bildes in Pixel

Vollständiges Beispiel

<html>
 <head>
  <title>
   Golem.de - API - Example for fetching articles from a special category via Golem.de-Webinterface
  </title>
  <script type="text/javascript" src="http://api.golem.de/download/js/latest/Golem/Request.js"></script>
  <script type="text/javascript" src="http://api.golem.de/download/js/latest/Golem/Api.js"></script>
  <script type="text/javascript" src="http://api.golem.de/download/js/latest/Golem/Api/Special/Article.js"></script>

  <script type="text/javascript">

   Golem.Request.KEY = '<ENTWICKLERSCHLÜSSEL>';

   function getArticles() {

    var request = new Golem.Api.Special.Article('linux', 5);

    request.fetchEach(addItem);

   }

   function addItem(article) {

    var elList = document.getElementById('articlelist');

    var elItem = document.createElement('LI');

    elItem.innerHTML = '<h2>'+article.headline+'</h2>'+
                        '<p>'+article.abstracttext+'</p>';

    elList.appendChild(elItem);

   }

  </script>
 </head>

 <body onload="getArticles();">

  <h1>Golem.de - Show latest articles of a special category</h1>

  <ul id="articlelist">
  </ul>

 </body>

</html>


Zu Handbuch Javascript-API