In diesem Lernprogramm werden wir darüber sprechen, wie Sie mit der Facebook-API interagieren und welche Tools Sie benötigen, um eine Verbindung herzustellen. Insbesondere wird die App, die wir erstellen werden, eine Verbindung mit dem Facebook-Konto des Benutzers herstellen und deren Status aktualisieren. Lass uns anfangen!
Schritt 1: Visual Studio-Projekterstellung
Zunächst müssen wir ein neues Projekt mit Visual Studio erstellen. Wir werden nur eine einfache App erstellen, also wählen Sie die Option "Windows Phone App":
Wenn Sie Visual Studio 2012 mit dem neuen WP8-SDK verwenden, werden Sie nach der Zielversion von Windows Phone OS gefragt. Wenn dies der Fall ist, wählen Sie einfach das Betriebssystem 7.1 aus.
Schritt 2: Hinzufügen der Benutzeroberfläche
Wenn das Projekt bereits erstellt wurde, öffnen Sie die Datei "MainPage.xaml", falls sie noch nicht geöffnet ist, und ändern Sie das Standard-Textfeld für Anwendung und Seitenname:
In unserem ContentPanel-Raster fügen wir jetzt zwei Zeilen hinzu, eine für eine TextBox, in die der Benutzer den neuen Status eingeben wird, und die andere für die Schaltfläche, um den Status zu übermitteln:
Fügen Sie dann einfach ein Textfeld in der ersten Zeile mit dem Namen "Message" und einer Schaltfläche in der zweiten Zeile ein:
Am Ende solltest du folgendes haben:
Schritt 3: Entwicklerkonten erstellen
Facebook verfügt über eine sehr umfassende API, um die Interaktion zwischen Apps und der Website zu ermöglichen. Über die API kann Ihre App eine Verbindung mit dem FB-Konto des Benutzers herstellen und mit diesem interagieren.
Um unsere App mit Facebook zu verbinden, müssen wir uns als Facebook-Entwickler registrieren. Um ein Facebook-Entwicklerkonto zu erstellen, rufen Sie die Facebook-Entwicklerseite auf, Melden Sie sich dann mit Ihrem Facebook-Account an oder erstellen Sie einen, falls Sie noch keinen haben. Wenn Sie sich bereits angemeldet haben, klicken Sie auf die Schaltfläche "Registrieren" und befolgen Sie die Anweisungen.
Schritt 4: Registrieren einer neuen App
Erstellen Sie nun eine neue App, indem Sie in Ihr Apps-Menü gehen und dann die Schaltfläche "Neue App erstellen" auswählen.
Nachdem Sie Ihre App erstellt haben, sehen Sie Ihre Seite mit den App-Einstellungen und darauf eine App-ID / API-Schlüsselnummer.
Kopieren Sie diese Nummer, kehren Sie zum Projekt zurück und erstellen Sie in der Datei "MainPage.xaml.cs" eine neue globale Konstantenzeichenfolge über Ihrem Konstruktor:
private const string FBApi = "IHR API-SCHLÜSSEL GEHT HIER"; // Konstruktor public MainPage () InitializeComponent ();
Schritt 5: Auswählen des Facebook C # SDK
Facebook hat einige großartige SDKs für iOS und Android, aber leider keine für WP7. Um eine Verbindung mit Facebook über eine WP7-App herzustellen, haben wir zwei Möglichkeiten: (1) Alle Anrufe manuell erstellen oder (2) Facebook verwenden C # SDK, ein nicht offizielles SDK, das speziell für C # -Anwendungen erstellt wurde.
Für dieses Tutorial verwenden wir das C # SDK. Jede Methode aus der Facebook-API ist bereits integriert, sodass unsere Aufgabe erheblich vereinfacht wird!
Schritt 6: Herunterladen des SDK
Dieses SDK ist nur über NuGet verfügbar. Falls Ihr Visual Studio den NugGet Package Manager nicht enthält, Sie müssen es von der NuGet-Homepage herunterladen. Um das Paket herunterzuladen, öffnen Sie die Package Manager Console in Visual Studio (Extras> Bibliothek Package Manager> Package Manager Console) und geben Sie den folgenden Befehl ein:Install-Package Facebook . Falls Sie Probleme mit der heruntergeladenen Version haben, versuchen Sie es mit diesem Befehl: Install-Package Facebook-Version 6.0.24
Schritt 7: Fügen Sie das FB SDK Ihrer App hinzu
Nun, da wir das SDK haben, werden wir es zu unserem Projekt hinzufügen. Fügen Sie einen neuen Import in der Datei "MainPage.xaml.cs" hinzu:
mit Facebook;
Schritt 8: Hinzufügen eines Browsers
Damit ein Benutzer eine Verbindung zu Facebook herstellen kann, muss er uns zunächst Zugriff und Erlaubnis zu seinem FB-Konto gewähren. Dies geschieht über die Facebook-Webseite. Daher müssen wir einen Webbrowser in unsere Anwendung aufnehmen. Der Browser sollte den Großteil der Seite abdecken, so dass er zunächst reduziert wird und dann sichtbar wird, wenn der Benutzer sich anmelden muss. Fügen Sie in der Datei "MainPage.xaml" einen neuen WebBrowser direkt unter dem ContentPanel hinzu:
Schritt 9: Verbindung mit Facebook
Wenn alles richtig eingestellt ist, können wir jetzt damit beginnen, unsere Anwendung zu codieren. Erstellen Sie eine neue FacebookClient-Variable und nennen Sie sie nur "Client". Hier werden alle Verbindungen hergestellt. Initiieren Sie auch die Variable innerhalb des Konstruktors:
Um tatsächlich etwas zu posten, muss der Benutzer auf die Schaltfläche "Post" klicken. Lass uns ein Klickereignis zu dieser Schaltfläche hinzufügen:
Wenn der Benutzer auf die Schaltfläche klickt, muss er sich bei Facebook anmelden und autorisieren, unsere App zu akzeptieren. Für diesen Prozess müssen wir den Browser sichtbar machen und zu einer vom Client angegebenen URL navigieren. Vorher müssen wir jedoch einige Anfangsparameter senden:
private void PostClicked (Objektsender, RoutedEventArgs e) // Client-Parameter var parameters = new Dictionary(); Parameter ["client_id"] = FBApi; parameters ["redirect_uri"] = "https://www.facebook.com/connect/login_success.html"; Parameter ["Antwort_Typ"] = "Token"; Parameter ["Anzeige"] = "Berührung"; // Der Umfang gibt uns den Zugriff auf die Benutzerdaten. In diesem Fall // möchten wir nur die Parameter an seiner Wand veröffentlichen ["scope"] = "publish_stream"; Browser.Visibility = System.Windows.Visibility.Visible; Browser.Navigate (client.GetLoginUrl (Parameter));
Wenn Sie Ihren Code jetzt ausführen und auf die Schaltfläche "Post" klicken, sollte der Browser mit der Facebook-Anmeldeseite angezeigt werden:
Schritt 11: Hinzufügen eines Navigationsereignisses
Nachdem sich der Benutzer bei Facebook angemeldet hat, wird der Browser zu einer URL navigiert, die unser Zugriffstoken für API-Aufrufe enthält. Sobald wir es abrufen, müssen wir es unserem Kunden zuordnen. Zu berücksichtigen ist, dass der Browser über viele Seiten navigieren kann (falsches Passwort, Benutzer hat unsere App abgelehnt usw.). Wir müssen also versuchen, das Token zu erhalten, sobald wir sicher sind, dass wir uns im Internet befinden richtige Seite.
Fügen Sie das navigierte Ereignis dem Webbrowser hinzu:
Fügen Sie dann die folgenden Zeilen zum Ereignishandler hinzu:
private void BrowserNavitaged (Objektsender, System.Windows.Navigation.NavigationEventArgs e) FacebookOAuthResult oauthResult; // Sicherstellen, dass die URL tatsächlich das Zugriffstoken hat if (! Client.TryParseOAuthCallbackUrl (e.Uri, out oauthResult)) return; // Überprüfung, ob der Benutzer unsere App erfolgreich akzeptiert hat, andernfalls wird einfach der Fehler angezeigt, wenn (oauthResult.IsSuccess) // Ergebnis des Ergebnisses client.AccessToken = oauthResult.AccessToken; // Den Browser ausblenden Browser.Visibility = System.Windows.Visibility.Collapsed; PostToWall (); else // Fehler verarbeiten MessageBox.Show (oauthResult.ErrorDescription); Browser.Visibility = System.Windows.Visibility.Collapsed;
Schritt 12: Hinzufügen einer Post-Methode
Nun, da wir Zugriff haben, können wir fortfahren und tatsächlich an die Benutzerwand posten. Erstellen Sie eine neue private Void-Methode namens postToWall und fügen Sie die folgenden Zeilen hinzu:
Der einzige Parameter, den wir an diesen Anruf senden müssen, ist die Nachricht, die wir an der Wand des Benutzers posten werden. Die Nachricht, die wir senden werden, ist der Text aus unserer TextBox "Message". Die Nachricht wird asynchron gesendet. Das Ereignis PostCompleted wird aufgerufen, sobald die Task abgeschlossen ist. Daher müssen Sie keinen Ereignishandler hinzufügen.
Schritt 13: PostCompleted-Ereignishandler
Da wir den Ereignishandler nur einmal hinzufügen möchten, fügen wir ihn dem Konstruktor hinzu, unmittelbar nachdem unser Client initialisiert wurde. Überprüfen Sie im Handler, ob die Veröffentlichung erfolgreich abgeschlossen wurde oder Fehler aufgetreten sind, und benachrichtigen Sie den Benutzer:
Mit diesem Code sollte unsere App bereits in der Lage sein, eine Nachricht über das Facebook-Konto des Nutzers zu posten.
Führen Sie die App im Emulator aus, versuchen Sie, eine beliebige Testnachricht zu posten, und Sie sollten am Ende eine Nachricht erhalten, die Sie dazu auffordert: "Nachricht erfolgreich veröffentlicht"..
Öffnen Sie jetzt das Facebook-Konto in einem Webbrowser, und Sie sollten die Nachricht sehen, die Sie gerade gepostet haben:
Herzliche Glückwünsche! Sie haben jetzt eine App, die eine Verbindung zu Facebook herstellen kann, aber es gibt noch einige Dinge, die wir verbessern könnten. Wir könnten beispielsweise versuchen, das Zugriffstoken zu speichern, sodass sich die Benutzer nicht jedes Mal anmelden müssen, wenn sie die App öffnen.
Schritt 15: Speichern des Acces-Tokens
Wir werden das Token für die Anwendungseinstellungen speichern. Dazu müssen wir jedoch die IsolatedStorage-Bibliothek importieren:
using System.IO.IsolatedStorage;
Mit dieser Bibliothek können wir jetzt einfach die Methode erstellen:
private void SaveToken (String token) // Wenn es sich um das erste Speichern handelt, erstellen Sie den Schlüssel in ApplicationSettings und speichern Sie das Token. Andernfalls ändern Sie einfach den Schlüssel if (! IsolatedStorageSettings.ApplicationSettings.Contains ("token")) IsolatedStorageSettings.ApplicationSettings. Hinzufügen ("Token", Token); else IsolatedStorageSettings.ApplicationSettings ["token"] = token; IsolatedStorageSettings.ApplicationSettings.Save ();
Schritt 16: Abrufen mit dem gespeicherten Token
Jetzt müssen wir das Token von IsolatedStorage erhalten:
private string GetToken () // Wenn sich kein Token im Speicher befindet, geben Sie einfach null zurück. Andernfalls geben Sie das Token als String zurück. if (! IsolatedStorageSettings.ApplicationSettings.Contains ("token")) gibt null zurück. else gibt IsolatedStorageSettings.ApplicationSettings ["token"] als Zeichenfolge zurück.
Schritt 17: Mit dem gespeicherten Token protokollieren
Mit diesen beiden Methoden können wir das Token jetzt abrufen und es jedem Client bei jedem Öffnen der App zuweisen:
Zu beachten ist auch, dass der Benutzer die Berechtigungen unserer App ablehnen kann. Daher müssen wir dies erkennen und erneut um Berechtigungen bitten. Diese Erkennung sollte mit unserem PostCompleted-Handler durchgeführt werden, da uns Facebook auf ein Problem mit unserem Post hinweisen wird. Fügen Sie unserem PostCompleted-Handler die folgenden Zeilen hinzu:
client.PostCompleted + = (o, args) => // Auf Fehler prüfen if (args.Error! = null) // Autorisierungsfehler if (args.Error ist FacebookOAuthException) Dispatcher.BeginInvoke (() => MessageBox .Show ("Autorisierungsfehler")); // Entferne das eigentliche Token, da es nicht mehr funktioniert. SaveToken (null); client.AccessToken = null; else Dispatcher.BeginInvoke (() => MessageBox.Show (args.Error.Message)); else Dispatcher.BeginInvoke (() => MessageBox.Show ("Nachricht erfolgreich gesendet")); ;
Schritt 19: Ändern Sie die Zurück-Schaltfläche
Als letzten Schritt müssen wir dem Benutzer die Möglichkeit geben, den Browser jederzeit zu schließen. Diese Aktion sollte der Schaltfläche "Zurück" zugewiesen werden. Daher müssen Sie nur den Ereignishandler ändern, um dies zu erreichen.
Fügen Sie Ihrem Code die folgende Methode hinzu:
protected override void OnBackKeyPress (System.ComponentModel.CancelEventArgs e) // Wenn der Browser sichtbar ist, verbergen Sie ihn und stornieren Sie das Navigationsereignis if (Browser.Visibility == System.Windows.Visibility.Visible) Browser.Visibility = System.Windows Sichtbarkeit. Zusammengefallen; e.Cancel = true; base.OnBackKeyPress (e);
Schritt 20: Das Endprodukt
Testen Sie Ihre App noch einmal, jetzt haben Sie eine voll funktionsfähige Facebook-App!
Von hier aus weiter
Bei Facebook geht es nicht nur darum, Ihren Status zu aktualisieren. Es gibt viele andere Dinge, die Sie Ihrer App hinzufügen können, z. B. das Freigeben von Fotos, das Senden von App-Empfehlungen an Freunde usw. Das Facebook C # SDK bietet viele Möglichkeiten für die Facebook-Integration. Um mehr darüber zu erfahren, besuchen Sie die Webseite und arbeiten Sie daran, Ihre App sozialer zu gestalten!
Share
Accentsconagua
