Login
Newsletter
Werbung

Do, 16. April 2015, 15:00

Mobile Blogging-App mit DreamFactory, WordPress und Mailgun, Teil 2

Dieses Tutorium beschreibt Schritt für Schritt die Erstellung einer mobilen Blogging-App, die auf WordPress und Mailgun zugreift, mit DreamFactory.

Dieses Tutorium besteht aus zwei Teilen, die aufeinander aufbauen. Im ersten Teil wurde eine App mit Zugriff auf das WordPress-API erstellt. In diesem zweiten Teil wird die App mit Zugriff auf das Mailgun-API erweitert und fertiggestellt. Alle Teile kann man über die Übersicht finden.

Schritt 5: Den Dienstzugriff mit Swagger vereinfachen

Das im ersten Teil erstellte Beispiel, obwohl funktional, machte einen etwas kruden Gebrauch von der DSP, indem die Transaktionen mit rohem JSON und AJAX ausgeführt wurden. Obwohl Sie dies sicherlich tun können, bietet DreamFactory eine elegantere Lösung durch die Integration von Swagger in seine Service-Plattform und Client-SDKs.

Wie funktioniert das? Es ist ziemlich einfach. Zuerst müssen Sie eine Swagger-konforme Definition Ihres Dienstes zur DSP hinzufügen. DreamFactory generiert dann clientseitigen Code aus der Swagger-Definition, der vom Client-SDK verwendet werden kann. Dadurch können Sie Ihre Anwendungsentwicklung sofort durch direkten Aufruf Ihrer Dienste als clientseitige SDK-Methoden beginnen. Pfadvariablen, Abfrageparameter und Datenmodelle können in die Swagger-Definition aufgenommen werden, was die Interaktion zwischen Client und Server wesentlich vereinfacht.

Ein weiterer Vorteil dieser Methode ist, dass die Swagger-Service-Definition von der enthaltenen Swagger-UI direkt gelesen werden kann und verstanden wird. Hierdurch erhalten Sie eine einfache Möglichkeit, Ihre Service-Definitionen direkt in einem Browser zu testen und Sie können die API-Anforderungen und -Antworten überprüfen, bevor Sie sie in Ihrer Anwendung verwenden.

Um zu sehen, wie das in der Praxis funktioniert, modifizieren wir das vorherige Beispiel, um diesen Zugang anzuwenden. Zunächst melden Sie sich bei Ihrer DSP an, öffnen die Registerkarte Services und wählen die zuvor erstellte API wordpress. Fügen Sie dann im Unterabschnitt Service Definition die folgende Service-Definition für die JSON-REST-API von WordPress hinzu und speichern Sie diese:

{
  "resourcePath": "/{api_name}",
  "produces": [
    "application/json",
    "application/xml"
  ],
  "consumes": [
    "application/json",
    "application/xml"
  ],
  "apis": [
    {
      "path": "/{api_name}/posts",
      "description": "Operations for posts",
      "operations": [
        {
          "method": "POST",
          "summary": "createPost() - Create a post",
          "nickname": "createPost",
          "parameters": [
            {
              "name": "body",
              "description": "Post data",
              "allowMultiple": false,
              "type": "string",
              "paramType": "body",
              "required": true
            }
          ]
        }
      ]
    }
  ],
  "models": {}
}

Dies ist offensichlich eine abgekürzte Service-Definition. Wie Sie gesehen haben, unterstützt die JSON REST API von WordPress weitaus mehr Operationen als hier gezeigt. Für die mobile Blogging-Anwendung befassen wir uns jedoch in erster Linie mit der Erstellung neuer Posts über die API, so dass die obige Service-Definition nur den entsprechenden POST-Vorgang abdeckt. Beachten Sie insbesondere den Bezeichner createPost, der schließlich als Methodenname im Client-SDK enden wird.

Sie können nun Ihre Datei $APP_ROOT/app.js für die Verwendung der Methode createPost() aus dem DreamFactory-Client-SDK aktualisieren:

$(document).ready(function() {

  // validate form
  $("#add-post-form").validate({
    submitHandler: function(form) {
      var title = $('#title').val();
      var body = $('#body').val();
      // call createPost() API method
      window.df.apis.wordpress.createPost({"body": {"title": title, "content_raw": body, "status":"publish"}},
        function(response) {
          $("#status").show();            
          $("#status").html("Blog post published successfully!");
        },
        function(response) {
          $("#status").show();            
          $("#status").html("There was an error.");
        }
      );  
    }
  });

});

Dies ist nicht nur besser lesbar, es sind auch deutlich weniger Codezeilen als in der vorhergehenden Version. Die DreamFactory-API kümmert sich um die Details der Formulierung und Übermittlung der AJAX-Anforderungen und den Umgang mit der Antwort, so dass Sie sich auf die Funktionalität der Anwendung konzentrieren können.

Kommentare (Insgesamt: 0 )
Pro-Linux
Pro-Linux @Facebook
Neue Nachrichten
Werbung