Enostavno Google Auth za Node.js

5 preprostih korakov za integracijo z Googlovo kodo.

Oči so se mi nabrekle od solz ko sem ugotovil, da zadnjih 10 ur kodiranja ni za nič… Passport.js mi je in ljudem tega sveta dal lažno upanje.

Nisem prepričan, če ste kdaj pogledali kodo v knjižnici Passport.js, vendar je ni prav veliko in tudi ni zelo dobra. V bistvu je malo kode, ki zagotavlja, da so vaše avtentikacije pravilno nameščene. Toda glavna pomanjkljivost tega je, da ubija vašo prožnost. S potnim listom morate zahteve za povratne klice preusmeriti na strežnik. Če ne veste, kaj to pomeni; v bistvu je zanič, če ustvarjate katero koli drugo aplikacijo, razen aplikacije, ki jo izda strežnik (na primer aplikacija za eno stran ali SPA).

Ampak ne skrbi! Tu je kratka vadnica, ki vam bo pokazala, kako pravilno dodati Google Auth.

Preden začnete ️

Ta vadnica predvideva, da imate:

  1. Dobro razumevanje JavaScript in Node.js
  2. Aplikacija s strežnikom

Super, greva!

1. korak: Namestite odvisnosti 🖥

Samo eno - na NPM je, če tega še niste domnevali.

  • googleapis

To je bilo enostavno!

2. korak: Konfigurirajte Google

Nato morate knjižnico konfigurirati s svojimi poverilnicami, tako da Google ve, kdo vlaga zahteve.

Če želite pridobiti poverilnice - če jih še nimate, pojdite na Google Console in ustvarite nov projekt. Ko imate nov projekt, zahtevajte nekaj ključev API-ja. Tu je dobra povezava za več pomoči glede tega.

Datoteka: src / google-util.js

Zgornja datoteka; uvozi knjižnico, ustvari konfiguracijski objekt z našimi podrobnostmi in doda funkcijo, ki se bo povezala z Googlom, ko to želimo.

3. korak: Pridobite URL za prijavo v Google

Zakaj to potrebujemo?… No, da se lahko nekdo prijavi v Google, ga moramo poslati na Googlovo prijavno stran. Od tu se bodo prijavili na svoj račun, nato pa bodo s svojo prijavo v podrobnosti preusmerili na našo aplikacijo.

Datoteka: src / google-util.js

Zgornja koda naredi nekaj stvari; določa, katere podatke in dovoljenja želimo od uporabnika, ko se prijavijo, in ustvari funkcijo, ki jo bomo uporabili za ustvarjanje URL-ja. Končno ustvarimo funkcijo, ki ustvari URL, ki ga boste morali poslati odjemalcu.

4. korak: Vaš korak - preusmerite svoje uporabnike na Googlov URL

Ta korak zahteva, da svoje uporabnike pošljete na URL, ki smo ga pravkar ustvarili. V svoji aplikaciji ustvarim URL v API-ju in ga pošljem na svoj sprednji del, kjer naredim href naslov gumba, npr.

 Prijava z Googlom 

Tako bo uporabnik preusmerjen na stran za prijavo.

Snemanje težav: če pridete na stran, ki vam pove, da nimate dostopa (ali kaj podobnega), to lahko pomeni, da niste pravilno konfigurirali poverilnic za Google projekt. Prepričajte se, da ste jih pravilno nastavili na svoji Google Console.

5. korak: Shranite podatke o prijavi

Upajmo, da bi se lahko prijavili v svoj google račun in Google bi vas preusmeril nazaj v vašo aplikacijo (ali naslov za preusmeritev, na katerega ste mu rekli, da gre). Zdaj moramo le zagotoviti, da se račun, v katerega smo se prijavili, ujema z uporabnikom v naši podatkovni bazi (ali ustvari takšnega).

Da bi to naredili, nam je Google podelil parameter na naslovu za preusmeritev, imenovan „koda“. To boste videli kot:

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

Ta parameter "kode" morate izvleči in ga vrniti Googlovi knjižnici api, da preverite, kdo je prijavljeni uporabnik. Tu je dober paket NPM, ki vam lahko pomaga pridobiti parameter, vendar ni pomembno, kako to storite.

Ko boste dobili parameter "koda" in ga poslali na strežnik, bomo lahko prejeli e-poštno sporočilo in ID uporabnika, ki ju bomo uporabljali v naši aplikaciji.

Datoteka: src / google-util.js

Zdaj morate preveriti e-poštno sporočilo ali ID glede na vašo bazo podatkov in se prijaviti ali uporabnika prijaviti - odvisno od vas!

Celotna različica

Tu je popolna različica kode brez vseh pripomb. Uporabite to za dober pregled. Če se zataknete, preverite zgornje primere z razlagami.

Yahoooo !!

Vaša aplikacija zdaj podpira Google. Če želite dobiti dostop do več Googlovih API-jev, jih preprosto dodajte v svojo "področje uporabe" in ko se uporabnik prijavi, bo pozvan, da vam omogoči dostop do teh podatkov, npr. Podatki Google Koledarja.

Če vam je ta članek všeč, ga prosimo, da mu pošljete nekaj klopov (lahko jih pustite do 50) ali če imate kakršna koli vprašanja, ali bom komentiral, se bom kar najbolje potrudil!

Sledi mi na tviterju.

Hvala!

Članek, ki so ga ustvarili ustanovitelji Authenticatorja - preprost in hiter avtor za vašo aplikacijo.

Več objav Jacka Scotta.

  • Kako sem zagnala zagon v 4 dneh
  • Izdelajte strežnik polnega GraphQL z Node.js
  • Zbogom Redux