Vienkārša Google Auth vietnei Node.js

5 Vienkāršas darbības, lai integrētu ar Google - iekļauts kods.

Manas acis uzpūta līdz asarām , kad sapratu, ka pēdējās 10 kodēšanas stundas ir veltīgas… Passport.js man un šīs pasaules cilvēkiem bija devusi viltus cerības.

Es neesmu pārliecināts, vai jūs kādreiz esat apskatījis kodu Passport.js bibliotēkā, bet tā nav ļoti daudz, un tas nav arī ļoti labs. Tas būtībā ir mazliet kods, kas nodrošina, ka autentifikācijas akreditācijas dati ir ievietoti pareizajā vietā. Bet galvenais trūkums ir tas, ka tas nogalina jūsu elastību. Izmantojot pasi, jums jānovirza atzvanīšanas pieprasījumi uz serveri. Ja jūs nezināt, ko tas nozīmē; būtībā tas ir sucks, ja jūs veidojat jebkāda veida lietotni, kas nav servera atveidota lietotne (piemēram, vienas lapas lietotne vai SPA).

Bet neuztraucieties! Šeit ir ātra apmācība, kas parādīs, kā pareizi pievienot Google Auth.

Pirms darba sākšanas ️

Šajā apmācībā tiek pieņemts, ka jums ir:

  1. Laba JavaScript un Node.js izpratne
  2. Lietojumprogramma ar serveri

Lieliski, iesim!

1. solis: instalējiet atkarības 🖥

Tikai viens - tas attiecas uz NPM, ja jūs to vēl nepieņēmāt.

  • googleapis

Tas bija viegli!

2. darbība: konfigurējiet Google

Pēc tam jums būs jākonfigurē bibliotēka ar saviem akreditācijas datiem, lai Google zinātu, kas iesniedz pieprasījumus.

Lai iegūtu akreditācijas datus - ja jums to vēl nav - dodieties uz savu Google Console un izveidojiet jaunu projektu. Kad esat izveidojis jaunu projektu, pieprasiet dažas API atslēgas. Šeit ir laba saite, lai iegūtu vairāk palīdzības šajā jautājumā.

Fails: src / google-util.js

Iepriekš minētais fails; importē bibliotēku, izveido konfigurācijas objektu ar mūsu informāciju un pievieno funkciju, kas izveidos savienojumu ar Google, kad mēs to vēlamies.

3. darbība: iegūstiet Google pieteikšanās URL

Kāpēc tas mums vajadzīgs?… Nu, lai mēs varētu pierakstīties Google, mums tas ir jānosūta uz Google pieteikšanās lapu. Turpmāk viņi pierakstīsies savā kontā, un pēc tam viņi tiks novirzīti uz mūsu lietotni ar savu pierakstīšanās informāciju.

Fails: src / google-util.js

Iepriekš minētais kods izdara dažas lietas; tas nosaka, kādu informāciju un atļaujas mēs vēlamies no lietotāja, kad viņi pierakstās, un tas izveido funkciju, kuru mēs izmantosim URL ģenerēšanai. Visbeidzot mēs izveidojam funkciju, kas ģenerē vietrādi URL, kas jums būs jānosūta klientam.

4. solis: jūsu kārta - novirziet savus lietotājus uz Google URL

Lai veiktu šo darbību, lietotājiem jānosūta uz URL, kuru tikko izveidojām. Savā lietotnē es ģenerēju vietrādi URL API un nosūtu uz manu priekšpusi, kur es to izveidoju par pogas href adresi, piem.

 Pierakstieties, izmantojot Google 

Tādējādi lietotājs nokļūs pierakstīšanās lapā.

Problēmu novēršana: ja jūs apmeklējat lapu, kurā teikts, ka jums nav piekļuves (vai kaut kas līdzīgs), tas var nozīmēt, ka neesat pareizi konfigurējis savus Google projekta akreditācijas datus. Pārliecinieties, ka esat tos pareizi iestatījis savā Google konsolē.

5. solis: saglabājiet pierakstīšanās informāciju

Cerams, ka jūs būtu varējis pierakstīties savā google kontā, un Google būtu jūs novirzījis atpakaļ uz savu lietotni (vai uz pāradresācijas adresi, kurai norādījāt, lai dotos uz). Tagad mums atliek tikai pārliecināties, vai konts, kurā viņi ir pierakstījušies, atbilst lietotājam mūsu datu bāzē (vai izveidojiet kontu).

Lai to izdarītu, Google ir piešķīris mums novirzīšanas adreses parametru ar nosaukumu “kods”. Jūs to redzēsit kā:

https://yourwebsite.com/callback?code=a-bunch-of-random-characters

Jums ir jāizņem šis “koda” parametrs un jānodod atpakaļ Google api bibliotēkai, lai pārbaudītu, kurš ir pieteicies lietotājs. Šeit ir laba NPM pakete, kas var palīdzēt jums iegūt parametru, taču nav nozīmes tam, kā jūs to darāt.

Kad esat ieguvis parametru “kods” un esat to nosūtījis uz savu serveri, mēs varam iegūt lietotāja e-pastu un ID, ko izmantot mūsu lietotnē.

Fails: src / google-util.js

Tagad viss, kas jums jādara, ir pārbaudīt e-pastu vai id, salīdzinot ar jūsu datu bāzi, un piesakieties lietotājam vai pierakstieties - tas ir atkarīgs no jums!

Pilna versija

Šeit ir pilna koda versija bez visiem komentāriem. Izmantojiet šo, lai iegūtu labu pārskatu. Ja iestrēdzat, pārbaudiet iepriekš minētos piemērus ar paskaidrojumiem.

Yahoooo !!

Jūsu lietotne tagad atbalsta Google. Lai piekļūtu vēl vairākām Google API, vienkārši pievienojiet tās masīvam “tvērumi”, un, kad lietotājs dosies pierakstīties, viņiem tiks piedāvāts jums piekļūt šiem datiem, piem. Google kalendāra dati.

Ja jums patika šis raksts, lūdzu, sniedziet tam dažus skaudrumus (varat atstāt līdz 50) vai arī, ja jums ir kādi jautājumi, varat komentēt, es darīšu visu iespējamo, lai atbildētu!

Sekojiet man Twitter.

Paldies!

Autentifikatora dibinātāju izveidots raksts - vienkārša un ātra jūsu lietotnes autentifikācija.

Vairāk Džeka Skota ziņu.

  • Kā es uzsācu starta darbību 4 dienu laikā
  • Veidojiet pilnu GraphQL Server ar Node.js
  • Ardievu Redux