יום שלישי, 11 בינואר 2011

#Facebook api with C



התממשקות ל Facebook זה לא דבר פשוט עם #C ולמעשה דורשת מספר הכנות ושינויים בשביל להשלים את התהליך, המאמר מחולק ל 3 חלקים, החלק הראשון נוגע בהגדרות החשבון שלנו ב Facebook החלק השני נוגע בחלקים הדרושים על מנת לבצע את הגדרות ההתממשקות שלנו כמו שצריך, והחלק האחרון נוגע באפליקציה שלנו.

הגדרות ב Facebook
הכרה של Facebook במערכת שלנו, על מנת לעשות זאת יש ליצור אפליקציה בתוך Facebook עצמו, תחילה יש ליצור חשבון ב Facebook, השלב הבא הוא להיכנס לקישור Developers  (מרכז האפליקציות בחשבון שלנו ב Facebook),לבחור ב See My Apps או ליצור אפליקציה חדשה בלחיצה על Create  one.

בשלב זה תכניסו תיאור ושם לאפליקציה ותשמרו, Facebook מייצר מספר מפתחות עבור האפליקציה שלנו.

appId
מספר חד ערכי עבור האפליקציה שלנו.

apiKey
מפתח עבור ה Api.

appSecret
מפתח עבור האפליקציה.

שים לב! שמור את המפתחות האלה במקום בטוח!



חשוב מאוד להגדיר את כתובת האתר שהולך לעבוד מול האפליקציה הזאת על מנת לאשר את החיבור שלו ל Api של Facebook , חשוב לציין נקודה שעדיין מוקדמת בתהליך אבל קריטית - עם ננסה להתממשק דרך אתר מקומי - (LocalHost) שאותו נפתח בשלבים הבאים, לא נוכל לעשות זאת , האתר חייב להיות עם כתובת חוקית.

התקנת רכיבים לצורך התממשקות:
על מנת לאפשר התממשקות אנחנו צריכים להוריד את ספריות ה Api של Facebook לאתר שלנו ולעשות שינויים ב web.config וב Framework שלנו.

Framework
יש להוריד ולהתקין את Framework 3.5.

Facebook Api
מחלקות ה Api של Facebook להורדה FacebookSDK.

ה Api מורכב ממספר מחלקות שמחוייבות להיות קשורות לאפליקציה שלנו על מנת לעבוד:

Facebook.dll
מחלקות כלליות של ה Api.

 Facebook.Web.dll
מחלקות ה Web של ה Api.

Microsoft.Contracts.dll
מערכת חדשה של מיקרוסופט לטיפול בשגיאות ובקלט \ פלט.
להורדה Microsoft contracts

 Newtonsoft.Json.dll
מחלקה לעבודה עם Json ו .Net.
להורדה Json.net

הקמת פרויקט התממשקות
הדבר הראשון שנעשה הוא פרויקט חדש ב Visual Studio של Asp.net ב Framework 3.5, אח"כ נעשה Reference למחלקות שהורדנו



יש לערוך את קובץ ה web.config על מנת שיוכל להכיר את כל ה components.
לפני התגית  </configsections> יש להכניס:
<section name="facebookSettings" type="Facebook.FacebookConfigurationSection" />

אחרי התגית <\connectionstrings>יש להכניס:
<facebooksettings appid="xxxxxxxxxxxx" appsecret="xxxxxxxxxxxx"
cookiesupport="true" / >
בנקודה זו יש להכניס את המפתחות ש Facebook יצר לנו עבור ההתממשקות ל Api.

נערוך את דף ה Index של האתר שלנו:
נוסיף לתגית < html> בראש העמוד:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">


נכניס לתוך ה < body>  את הטופס הבא:

<form id="form1" runat="server">
    <div>
              <div id="fb-root">
     </div>
     <fb:login-button autologoutlink="true" onlogin="window.location.reload();"
        perms="email"></login-button>
     <script type="text/javascript">
        window.fbAsyncInit = function () {
         FB.init({ appId: 'xxxxxxxxxxxx', status: true, cookie: true, xfbml: true, 
         reloadIfSessionStateChanged:  true });
         };
         (function () {
         var e = document.createElement('script');
         e.type = 'text/javascript'
         e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
         e.async = true;
         document.getElementById('fb-root').appendChild(e);
         } ());
</script>
User ID:<label id="LabelUserid" runat="server"></label>
First Name:<label id="LabelFirstName" runat="server">lt;/label>
Last Name:<label id="LabelLastName" runat="server">lt;/label>
<img id="imageUser" runat="server" visible="true" /></img</div>
</form>

עכשיו נערוך את הקוד שמאחרי הדף:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Facebook;
using Facebook.Web;
using System.IO;

public partial class facebook : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
   {
       FacebookApp fapp = new FacebookApp();
       Authorizer auth = new Authorizer(fapp);
       auth.Perms = "email";

       if (auth.IsAuthorized())
      {
        LabelUserid.Text = fapp.UserId + "";
        JsonObject result = (JsonObject)fapp.Api("/me");
        LabelFirstName.Text = (String)result["first_name"];
        LabelLastName.Text = (String)result["last_name"];
        imageUser.ImageUrl = "http://graph.facebook.com/" + fapp.UserId + "/picture
        ?type=large";
        imageUser.Visible = true;
      }
   }
}

קיבלנו אובייקט Json מה Api ועכשיו אנו שולפים את הפרמטרים של ה Profile של המשתמש באפליקציה בעצם ביצענו Login in ל Facebook, ה Api עם המון אפשרויות וניתן לעשות דברים נוספים כמו הוספת תגובות, קריאה והעלת תמונות ועוד ,החלק העיקרי הוא שלב ההתממשקות ובעצם כל אפליקציה שניצור ב Facebook מחייבת התחברות של המשתמש לחשבון האישי שלו כמובן שזה מצריך אישור של המשתמש.

הדף של האפליקציה שלנו:
הדף לאחר ההתממשקות:

נשמור את הפרויקט ונעלה אותו לשרת.
בהצלחה...
פורסם על ידי ב-
תוויות: , , ,

4 תגובות:

  1. Unknown25 בינואר 2011 בשעה 1:57

    אין אפשרות לבצע התמשקות עם Framework 2 ?

    השבמחק
  2. Proxytype26 בינואר 2011 בשעה 14:14

    לא זה לא אפשרי, הספרייה של FaceBook תומכת מ 3.5.

    השבמחק
  3. Unknown1 באוגוסט 2012 בשעה 1:12

    היי איך אפשר ליצור איתך קשר? אני צריכה עזרה בפיתוח אפליקציה שפיתחתי לפייסבוק, כתובת המייל שלי: reut.robi@gmail.com
    אודה מאוד לעזרתך!!!! רעות

    השבמחק
  4. Proxytype2 באוגוסט 2012 בשעה 10:49

    מצטער רעות , אם את רוצה עזרה עלייך לשאול כאן בבלוג...
    בהצלחה...

    השבמחק

הירשם ל- תגובות לפרסום (Atom)