Dus je wilt een Facebook-applicatie bouwen en letterlijk miljoenen gebruikers bereiken. Gelukkig is het schrijven van een applicatie met behulp van de API niet zo moeilijk om te leren (voor de basis, hoe dan ook). In deze tutorial zullen we een Facebook-app schrijven die een willekeurige quote genereert die in het profiel van de gebruiker wordt weergegeven.

Ermee beginnen

Het is vermeldenswaard dat de Facebook API beschikbaar is voor een aantal talen, allemaal vermeld op de Wiki van Facebook Developers. Ik zal PHP 5 gebruiken voor deze tut. U moet ook de PHP 5 Client Library downloaden, die ik in de SRC-bestanden heb opgenomen. Alle code die hier wordt weergegeven, bevindt zich in het index.php-bestand.

Stap 1: initialiseer uw app

De eerste stap om een ​​Facebook API-sleutel te krijgen, waarmee uw app informatie van Facebook kan ophalen. Ga naar de Facebook-ontwikkelaarstoepassing en klik op de knop "Een nieuwe toepassing instellen". Kies een naam, ga akkoord met de Algemene voorwaarden en u heeft uw API. Nu moet je je canvaspaginanaam en callback-URL instellen.

Uw canvaspagina is het toepassingsgebied binnen Facebook; de naam wordt toegevoegd aan de URL en ziet er als volgt uit: http://apps.new.facebook.com/[YOUR APP NAME]. De callback-URL verwijst naar de server die de app-bestanden host. Om deze in te stellen, klikt u op de pagina "Mijn toepassingen" op "Instellingen bewerken" aan de rechterkant. Je ziet de velden om beide in te vullen, zoals ik deed in de schermafdruk hieronder. Hoewel er veel andere opties zijn, is er geen nodig voor deze zelfstudie. Klik op 'Opslaan' en je bent nu klaar om je eerste Facebook-app te maken. Facebook biedt zelfs een aantal opstartcodes. Ik heb de extra dingen weggelaten en je alleen gegeven wat je nodig hebt om je app te initialiseren ...

 require_login (); $ callbackurl = 'http://www.casabona.org/nettuts/'; ?>

Dit is vrij ongecompliceerde code. We maken een Facebook-object met behulp van onze API-sleutel en app-geheim, die we kregen toen we de API-sleutel maakten. Het eerste wat we daarna doen, is om de gebruikers-ID van de ingelogde gebruiker te krijgen. Dit zal waardevol voor ons zijn als we dingen doen die de naam van de gebruiker, de vrienden van de gebruiker, enz. Krijgen. Ik heb ook het $ callbackurl om het gemakkelijker te maken om naar afbeeldingen of andere bestanden te linken, omdat Facebook relatieve koppeling niet toestaat.

Stap 2: De toepassing schrijven

Als we geen specifieke Facebook-oproepen plaatsen, is dit net als het schrijven van een php-toepassing. Hieronder staat onze code.

 // initialiseer een reeks aanhalingstekens $ quotes = array ("Alleen degenen die groot durven falen, kunnen ooit veel bereiken.", "Neem mijn vrouw. Alsjeblieft!", "Ik geloof dat wat je niet doodt je alleen maar ... VREEMDELAAR "); // Selecteer een willekeurige. $ i = rand (0, sizeof ($ quotes) -1); // print de CSS-afdruk ('  '); print "
Nettuts Quotes
"; print"
". $ haalt [$ i] aan."
";

Dit is alles wat u hoeft te doen om naar de canvaspagina af te drukken. Een ding om op te merken is de manier waarop we CSS maken. We kunnen een bestand als style.css niet noemen. We moeten de CSS in de HTML opnemen. Dit is omdat onze CSS geen invloed heeft op Facebook's. Je moet ook weten dat je bij het stijlen van divs alleen klassen kunt gebruiken, geen id. De code die we hebben gemaakt, produceert zoiets als dit:

Stap 3: De profiellijst maken

Eindelijk wat Facebookspecifieke dingen. De onderstaande code is nodig om ons citaat toe te voegen aan het profiel van de gebruiker, op voorwaarde dat ze onze app in hun profiel weergeven. In onze app heb ik de volgcode hieronder toegevoegd $ i = rand (0, sizeof ($ quotes) -1);

 // prepare string for profile box $ text = ('  '); tekst $. = ('
'. $ citeert [$ i]. '
'); // stel profieltekst in $ facebook-> api_client-> profile_setFBML ($ text, $ user_id);

Merk op dat ik hier twee dingen heb gedaan: herdrukte de CSS en plaatste alles in een string genaamd $ text. Dit komt omdat de functie de tekst in het profielvak instelt, profile_setFBML, neemt twee argumenten: de tekst die moet gaan in het profielvak en de id van de gebruiker. Elke CSS die voor de canvaspagina is gedefinieerd, wordt niet naar het profiel overgedragen, dus we moeten die ook aan ons eerste argument toevoegen. Het eindresultaat is dit:

Dat is het!

We hebben natuurlijk alleen maar het oppervlak gekrast voor zover de ontwikkeling van Facebook-toepassingen gaat. Echter, met de Wiki en bronnen die Facebook je geeft wanneer je een API-sleutel krijgt, zou je goed op weg moeten zijn om de volgende grote app te maken! Als je deze app in al zijn glorie wilt bekijken, kun je hier gaan, zolang je maar een Facebook-account hebt.