Dieser Artikel wurde maschinell übersetzt.

Innovation

Grundlegende Facebook-Programmierung: Widgets und Chronik

Dino Esposito

Nachdem die einige grundlegende Aspekte der Facebook Programmierung in früheren Artikeln, werde ich nun erläutern, Tools und Techniken zum Anzeigen und Abrufen von Inhalten aus einer Facebook-Wand zu teilen es mit anderen Mitteln und catalog es für etwas anderes, wie Business Intelligence (BI)-Analysen.

Nicht alle Unternehmen haben das gleiche Maß an Interesse an der Welt von social Communities wie Facebook. Eine Lektion ich gelernt habe, ist jedoch in allen Unternehmen, die regelmäßig einer internen Abteilung — gewöhnlich Vermarktung — endet mit einem starken Interesse an näher zu den Kunden und, was vielleicht noch wichtig, dass Kunden das Unternehmen näher. Eine Facebook-Fan-Seite ist eines der Werkzeuge, Kontakte zu gewinnen und die Anzahl der Vorlieben und der Grad der Aktivität auf der Seite können Messen Sie den Erfolg der Initiative.

Wie passt dazu programmieren? Eine Facebook-Seite gesund und munter zu halten und Benutzeraktivität anzuregen, die erhöht sich die Zahl der "Menschen sprechen", müssen Sie interessante Inhalte zu veröffentlichen – und häufig. Manchmal kann das Unternehmen Mitarbeiter einfach recherchieren und Erstellen von Inhalten für die Facebook-Seite leisten. Manchmal kommt stattdessen gute Inhalte für die Facebook-Seite direkt aus den regelmäßigen Fluss des Unternehmens. In diesem Fall wäre es ein bisschen problematisch für Mitarbeiter, die ihre reguläre Arbeit Verlängerung über eine Facebook-Seite zu berichten, was sie tun zu reservieren. Stellen Sie sich beispielsweise, dass die Website auf dem laufenden ist. Der interne Workflow könnte Vorbereitung des Textes, bekommen es genehmigt, veröffentlichen es in das interne System und wartet auf das Content Managementsystem zu machen, dass live auf der Website. Wenn die gleiche Nachrichten auf Facebook veröffentlicht werden sollte, auch die meiste Zeit dieselbe Person öffnet die Facebook-Seite als Admin und nur Beiträge Inhalt manuell. Es funktioniert oft auf diese Weise heute, aber es ist kein Ansatz, der skaliert. Dies ist, gerade wo Facebook Programmierung passt.

Darüber hinaus buchen

In den letzten Ausgaben dieser Rubrik, ich sprach das Hauptthema der Entsendung zu einer Facebook-Wand und die Grundlagen des Aufbaus einer Website und einer desktop-Anwendung, die mit dem Facebook-Konto des Benutzers interagieren können (sehen Sie alle meine Spalten bei bit.ly/hBNZA0). Für eine Unternehmens-Szenario, wo die Übungswand des Unternehmens-Fanpage ist, ist der Ansatz nicht wirklich anders. Alles was ändert ist das Konto, das Beiträge erhält.

Der erste Schritt zur Facebook Programmierung findet also auf jeden Fall eine Möglichkeit, Inhalte zu bestimmten Wänden auf automatisierte Weise unter der Kontrolle Ihrer Software zu veröffentlichen.

Im Laufe der Zeit wird der Inhalt, die freigegebenen in des Unternehmens-Fan-Seite, die in der Regel umfasst, marketing-Kommunikation, eine nützliche Ressource für das Unternehmen. Es wird wertvolle Informationen, den das Unternehmen vielleicht abrufen und weiter zu teilen oder zu analysieren. Und dies ist ein weiterer großer Fit für Facebook Programmierung.

Dergleichen Box Widget

Eine schnelle und einfache Möglichkeit, einige Facebook-Inhalte zu Ihrer Website hinzufügen ist durch die Like Box-Widget. Das Widget Listet aktuelle Beiträge auf einer Facebook-Seite als auch eine optionale Liste von Benutzern, die wie die Seite gemacht. Für Websites mit Inhalten, die auf Facebook veröffentlicht interessiert ist dies der erste Schritt zu erreichen. Es ist wichtig zu beachten, dass die Facebook Like Box sozialen Plug-in nur mit Facebook Fan-Seiten verwendet werden soll ist und wird nicht funktionieren, wenn Sie es mit einem persönlichen Facebook-Konto verbinden.

Beachten Sie auch, dass Facebook zwischen Fan-Seiten und Profil-Seiten unterscheidet. Die Quintessenz ist, dass Fan-Seiten für Unternehmen sind, während Profilseiten für Einzelpersonen sind. Was die zulässigen Aktionen angeht, gibt es einige Unterschiede zwischen den beiden. Vor allem kann ein Team von Menschen auf eine Fan-Seite Admin-Rechte haben. Darüber hinaus können Beiträge zu einer Fanseite gezielt werden von Sprache und Standort Anhänger (naja, Ventilatoren, tatsächlich) erreichen, die am besten sie empfangen können. Fan-Seiten unterstützen zusätzliche Features und per Ads gefördert und gesponsert von Artikeln.

Umgekehrt sollen Profilseiten Besitzer mit Freunden und Familie bleiben zu lassen. Ein Freund wird zwingende Voraussetzung um Updates, obwohl durch den Abonnement-Mechanismus nicht-Freunde Ihre Updates auch erhalten können.

Konfigurieren der Like-Box für eine Webseite könnte nicht einfacher sein. Vorschau die Inhalte angezeigt werden können und greifen damit verbundenen HTML direkt von der Facebook-Entwickler-Website. Gehen Sie zu bit.ly/hFvo7y für eine live-Demo. Am Ende geht es arrangieren eine lange URL auf ein Iframe-Element festgelegt. Abbildung 1 listet die Parameter Sie in der URL können.

Abbildung 1-Parameter die Facebook Like-Box konfigurieren

Alles, was Sie tun ist Anordnen einer URLs und binden ihn an ein Iframe, wie in Abbildung 2.

Abbildung 2 binden eine URL an einen Iframe

<iframe src="//www.facebook.com/plug-ins/likebox.php
  ?href=http://www.facebook.com/etennisnetpage
    &width=292&height=490
    &colorscheme=light
    &show_faces=false
    &stream=true
    &header=true
    &appId=xxxxxxxxxxxxxxx"
  scrolling="no"
  frameborder="0"
  style="border:none; overflow:hidden; width:292px; height:590px;"
  allowTransparency="true">
</iframe>

Es ist selbstverständlich, dass Sie auch die Like-Box in einer desktop-Anwendung einbetten können (beispielsweise ein Windows Presentation Foundation— oder WPF-Anwendung) durch ein WebBrowser-Steuerelement.

Wie Sie sehen können, kann für einige schnelle Styling, das in den meisten Fällen funktioniert das plug-in. Möchten Sie Ihr eigenes CSS gelten (soweit es möglich und dokumentiert ist) sollten Sie jedoch die Like-Box mit JavaScript und HTML5 einbetten. Abbildung 3 zeigt die Ausgabe des einen Like-Box für eine Beispiel-Website mit benutzerdefinierten und regelmäßige (helle) Stil.

Abbildung 3 Beispiel wie Box

Die Aktivität, die Plug-in

Eine weitere schnelle Möglichkeit vorhandenen bestimmten Facebook-Inhalte auf Webseiten oder desktop-Anwendungen (über Web-Browser-Komponenten) zu übernehmen ist die Aktivität-Plug-in.

Dieses plug-in Aggregate-Geschichten, die aus der Interaktion der Benutzer mit Ihrer Website über Facebook. Beachten Sie, dass das Ziel hier ist eine Facebook-Seite, sondern eher eine externe Site nicht. Die solche RSS-Feeds generieren Beispielaktionen Geschmack Inhalt der Seite ansehen von Videos, kommentieren und Weitergabe von Inhalten von der Website. Das plug-in kann auch erkennen, ob der aktuelle Benutzer der Site, die die Aktivität-Plug-in enthält bei Facebook angemeldet ist oder nicht. Wenn ja, ist das angezeigte Futter auf die Freunde des Nutzers beschränkt. Andernfalls zeigt das plug-in Empfehlungen von auf der ganzen Site, gibt dem Anwender die Möglichkeit, auf Facebook einloggen und erhalten mehr gezielte Rückmeldung. Hier finden Sie das Markup, das Sie (Beachten Sie benötigen, dass die Aktivität-Plug-in nur durch HTML5 Markup verwendet werden kann):

<div class="fb-activity"
  data-site="www.yoursite.com"
  data-app-id="xxxxxxxxxxxxx"
  data-width="300"
  data-height="300"
  data-header="true"
  data-recommendations="true">
</div>

Sie müssen die JavaScript-SDK in Ordnung für dieses Markup der Seite zu produzieren, was ist in integrieren Abbildung 4.

Abbildung 4 die Aktivität-Plug-in Aktion

Zugriff auf die Zeitachse

In Vergangenheit Spalten verwendet ich Facebook C# SDK an der Wand nur-Text und Anlagen. Sobald die Post erfolgt, können Freunde und Fans mit ihm interagieren gefallen, teilen sie und kommentieren sie. Mal sehen, was es braucht, um die Zeitachse eines bestimmten Benutzers zu lesen.

Facebook weist eine einzigartige und ziemlich lange ID zu überweisen, ob Profil oder Fan-Seite. Benutzer, verwenden nicht jedoch diese ID, um Seiten zu identifizieren. So ist das erste, was zu tun, um einen Zeitplan zu lesen den öffentlichen Name der Seite (oder Benutzer) entsprechen der zugrunde liegenden Facebook-ID Als bloße Übung können Sie Folgendes in die Adressleiste des Browser eingeben: https://Graph.Facebook.com/Your-Page-Name.

Der Platzhalter "your-Seite-Name" ist nur der Name des Kontos, wie Sie eingegeben werden, um die Seite zu erreichen. Die ID des Kontos für die Zeitachse gelesen werden soll, ist nur der erste Schritt. Außerdem müssen Sie authentifiziert werden, um den Feed zugreifen. Die Quintessenz ist, dass jede Operation, die direkt gegen die zugrunde liegende Facebook Graph API OAuth-Authentifizierung erforderlich ist. Dies bedeutet, dass die gleichen vorbereitenden Schritte im letzten Spalten diskutiert auch hier getan werden müssen:

• Erstellen Sie eine Facebook-app mit Facebook-Back-End.
• Fordern Sie den Benutzer, die die Facebook-app funktionieren im Namen des Kontos autorisieren. Dieser Schritt liefert ein Zugriffstoken, das den Benutzer (für eine begrenzte Zeit) zusammenhält und Facebook app.
• Verwenden Sie das Zugriffstoken als Schlüssel, um gegen die Graph-API aus der Host-Anwendung (z. B. eine ASP.NET MVC Anwendung) zu betreiben.

Einmal erworben, kann das Zugriffstoken in einem Cookie gespeichert und für jede weitere Operation verwendet werden, bis sie abläuft. Hier ist der erforderliche Code um das rohe Futter aus dem Facebook-Server zu erhalten:

var name = "name-of-the-user"; 
  // For example, joedummy
  var client =
    new FacebookClient(access_token);
  dynamic user = client.Get(name); 
  dynamic feed =
    client.Get(name + "/feed");

Beim erste Aufruf der Facebook-Client erforderlich nicht streng das Zugriffstoken, wie es erwartet wird, nur öffentliche Informationen über den Benutzer zurück. Die Benutzervariable verfügbar Eigenschaften wie First_name, Last_name, Id und Lage. Abhängig von Ihren Absichten müssen Sie nicht diesen Anruf zu tätigen. Der zweite Aufruf von der Facebook-Client ist, was wirklich funktioniert der Trick. Es dauert eine Zeichenfolge, die den Pfad des Benutzers Feed kennzeichnet. Sie bauen den Pfad Verketten die Account-Namen mit der /feed Zeichenfolge. Im Gegenzug erhalten Sie ein dynamisches c#-Objekt aus einem zugrunde liegenden JSON-Stream gebaut. Abbildung 5 zeigt die Struktur der JSON-Datenstrom, wie von Fiddler gefangen.

Abbildung 5 die JSON-Struktur eines Elements Timeline in Facebook

Es zeigt, dass der ausgewählte Beitrag zwei Typen von Aktionen hat — es mochte und kommentiert wurde. Es zählt derzeit 14 mag. Weitere Informationen über Menschen, die es kommentierte oder mochte es sind verfügbar, wie Sie Knoten zu erweitern. Schließlich finden Sie den Inhalt der Post. Auf der Ebene von JSON ist der Inhalt der Post das Nachrichtenfeld.

Es ist wichtig zu beachten, dass nicht alle Beiträge die gleiche Struktur aufweisen; Dies ist der Grund, warum die Facebook C# SDK nicht glatt, statisch definierte Klassen als Daten-Transfer-Objekte (DTOs) verwendet. Ein gemeinsamer Haken ist, dass die Post eine Nachricht, Link und Bild fehlt, aber ein Geschichte-Feld enthält. Dies ist beispielsweise der Fall, wenn der Admin eine Sammlung von Fotos hinzufügt.

Das Facebook C# SDK Hände Sie nur ein dynamisches c#-Objekt. Analyse, dass in mehr Datentypen definiert — oder beschließen, dass das Objekt gut ist, da ist bis auf die Ansicht Durchlassen von — ist auf Ihren Anruf. Abbildung 6 zeigt einen Code, der versucht, das dynamische Objekt in eine klassische c#-Klasse zu analysieren.

Abbildung 6 analysieren ein dynamisches Objekt in einer klassischen c#-Klasse

public class FacebookPost
{
  public String PostId { get; set; }
  public String Author { get; set; }
  public String Picture { get; set; }
  public String Link { get; set; }
  public String Published { get; set; }
  public String ContentHtml { get; set; }
  private delegate String ExtractDelegate();
  public static IList<FacebookPost> Import(dynamic data)
  {
    var posts = new List<FacebookPost>();
    foreach (var item in data)
    {
      var tempItem = item;
      var fb = new FacebookPost
      {
        PostId = Extract(() => tempItem["id"]),
        Published = Extract(() => tempItem["created_time"]),
        Picture = Extract(() => tempItem["picture"]),
        Link = Extract(() => tempItem["link"]),
        Author = Extract(() => tempItem["from"]["name"])
      };
      try
      {
        fb.ContentHtml = Extract(() => tempItem["message"]);
      }
      catch
      {
      }
      if (!String.IsNullOrEmpty(fb.ContentHtml))
        posts.Add(fb);
      }
      return posts;
    }
  private static String Extract(ExtractDelegate func)
  {
    try {
      return func();
    } catch {
        return null;
      }
  }
}

Der ärgerlichste Teil dieses Codes ist ein wirksames Mittel zu prüfen, ob eine bestimmte Eigenschaft für das dynamische Objekt definiert ist, die Sie analysieren zu finden.Einige stackoverflow.com-Benutzer Stimmen auf den Lösungsansatz Abbildung 6, basierend auf einen Delegaten.

Umgang mit sozialen Netzwerken eröffnet eine ganz neue Welt der Möglichkeiten, die werden Möglichkeiten für Entwickler denken und neue kreative Anwendungen zu realisieren.Sie sollten als .NET Entwickler ein Freund von Facebook C# SDK.

Dino Esposito ist der Autor von „Architecting Mobile Solutions for the Enterprise” (Microsoft Press, 2012) sowie „Programming ASP.NET MVC 3” (Microsoft Press, 2011) und Mitverfasser von „Microsoft .NET: Architecting Applications for the Enterprise" (Microsoft Press, 2008). Esposito lebt in Italien und ist ein weltweit gefragter Referent für Branchenveranstaltungen. Sie können ihm auf Twitter unter twitter.com/despos folgen.

Unser Dank gilt dem folgenden technischen Experten für die Durchsicht dieses Artikels: Scott Densmore (Microsoft)
Scott Densmore ist eine leitende Entwicklerin bei Microsoft und arbeitet auf Funktionen in Visual Studio.Er arbeitete an agile Entwicklungsteams für die letzten 10 Jahre in große Unternehmensumgebungen und kleine Startups.Seine Interessen sind Wolke computing, mobile Geräte computing und social computing.Sie finden ihn am scottdensmore.com und auf Twitter bei @scottdensmore.