Közösségi funkciók a weboldaladra: Google
Rövid, két részes sorozatom első epizódjában egy Facebook-app elkészítését foglaltam össze röviden és tömören. Ezzel már lehetőség nyílik arra, hogy az ott említett közösségi funkciókat weboldalunkba be lehessen építeni.
Ebben a posztban a Google-ról lesz szó, hiszen ilyen fiókja ugyanannyi (ha nem több) embernek van, mint Facebook profilja. Az eljárás hasonló, mint a Facebooknál - bár a Google sem egyszerűsítette meg nekünk a dolgot.
Lássunk neki az app-készítésnek!
1. Jelentkezz be azzal a Google fiókoddal (ha több van), amelyikhez szeretnéd rendelni ezt az alkalmazást, majd menj a https://cloud.google.com/console oldalra.
2. Létre kell hoznod egy projektet (ez lesz az “alkalmazás”, csak itt projektnek hívják). Ehhez kattints a “Create project” gombra.
3. Add meg a nevét, valamint egy project id-t, ami kisbetűt, számot és kötőjelet tartalmazhat csak. Természetesen amit ő felajánl, az is maradhat. A felhasználási feltételeket el kell fogadni, a hírlevelet természetesen nem kötelező.
4. A rendszer dolgozik egy kicsit a projekt elkészítésén, amikor végzett, menüpontok jelennek meg a bal oldalsávban. Ezek közül az “APIS & AUTH” menün belül kattints az APIs linkre, és a megjelenő listában keresd meg a Google+ API sort. Itt kattints az “Off” feliratú gombra. Ezzel megint el kell fogadni egy adag feltételt, de utána a Google+ API bekapcsolt állapotba kerül.
Már nincs sok hátra :)
5. Kattints a bal oldalsávban a “Credentials” menüpontra. Az OAuth felirat alatt kattints a “Create new Client ID” gombra.
Az OAuth engedélyezésével weboldalad hozzáférhet az adott felhasználó bizonyos alapadataihoz,
már ha ezt a fiók tulajdonosa engedélyezi.
6. A megnyíló ablakban válaszd a “Web application” típust, és írd be az oldalad domain-jét az “AUTHORIZED JAVASCRIPT ORIGINS” mezőbe (http-vel együtt).
A Google a bejelentkezés után visszairányít a weboldaladra, egy megadott URL-re (ahol elvégzi a rendszer a bejelentkezés után teendőket). Ezt az url-t kell megadni az “AUTHORIZED REDIRECT URI” mezőben. Mindkét mezőbe több url-t is beírhatsz. Ha megvagy, kattints a “Create Client ID” gombra. A megjelenő generált adatokat nemsokára használni fogjuk.
7. Görgess lejjebb a “Public API access” blokkhoz, és kattints a “Create new key” gombra. A megjelenő ablakban válaszd a “Server key” gombot. Ez fogja adni a programokódokban “developer key”-nek nevezett kódot, ami szintén szükséges egy ilyen app beépítéséhez.
8. A következő ablakban meg kell adnod annak a szervernek az IP címét, amelyiken az oldalad fut. (Ha ezt nem tudod, akkor például itt megnézheted). A “Create” gombra kattintás után itt is legenerálódik egy kód.
A fentiekkel a projekt beállításai el is készültek. A “Consent screen” menüpontban még személyre szabhatod azt az oldalt, amit a felhasználó látni fog az első Google-bejelentkezésnél. Ezen az oldalon adja meg az engedélyt arra, hogy oldalad hozzáférjen a felhasználó e-mail címéhez, nevéhez, egyéb alap adataihoz. Ezért érdemes ezt a kis ablakot is beállítgatni, hogy a fiók tulajdonosa megbízzon a rendszeredben, és engedélyt adjon.
A kódokat egy saját fejlesztésű rendszerben is felhasználhatod, a mi CMS rendszerünkben azonban csak be kell illesztened 3 kódot a megfelelő helyre.
Következő állomás: Zend Framework alapú beépítés
Ezzel a két bejegyzéssel abban próbáltam segíteni, hogy a bejelentkezéshez (valamint ez után egyéb közösségi funckiók beépítéséhez) szükséges alkalmazást egyszerűen és gyorsan le tudd generálni.
Egy későbbi bejegyzésben webfejlesztőknek, programozóknak szeretnék majd segíteni abban, hogy egy Zend Framework alapú Google- és Facebook beépítést bemutatok. Addig is jó app-generálást :)!