NodeJS Googlovo preverjanje pristnosti z uporabo potnega lista in Express

Če ste že kdaj uporabljali svoj Google Račun za prijavo v aplikacijo, ste morda opazili, kako enostavno je to. Kliknite samo en gumb in vam ni treba vnašati e-pošte ali gesla. Čeprav se to zdi preprosto, je dogajanje pod pokrovom precej zapleteno. Vendar pa orodja, kot je Passport, olajšajo.

V tej vadnici se boste naučili, kako implementirati Googlovo preverjanje pristnosti v Node z uporabo Passport in Express.

Kaj je potni list?

potni list (ali Passport.js) je vmesna programska oprema za preverjanje pristnosti vozlišča, ki ponuja več kot 500 strategij za preverjanje pristnosti uporabnikov, vključno s socialno avtentikacijo z uporabo platform, kot sta Google in Twitter.

Uporabili boste potni list-google-oauth2 strategijo za preverjanje pristnosti uporabnikov v Googlu.

Ustvarjanje Googlovega sistema za preverjanje pristnosti v Node

To je pregled sistema za preverjanje pristnosti, ki ga boste ustvarili:

• Ko uporabnik klikne gumb za prijavo, bo poslan na stran za prijavo v Google, kjer se bo prijavil.
instagram viewer
• Google bo uporabnika preusmeril na vašo aplikacijo z žetonom za dostop. Žeton za dostop vam daje dovoljenje za dostop do podatkov o profilu tega uporabnika.
• Pošljite žeton za dostop Googlu, da pridobi podatke o profilu.
• Ustvarite novega uporabnika ali pridobite obstoječega uporabnika iz baze podatkov.
• Uporabite JWT za zaščito občutljivih poti.

Kako nastaviti Googlovo preverjanje pristnosti v NodeJS s pomočjo potnega lista

Sledite spodnjim korakom, da pooblastite uporabnike z Google OAuth,

1. korak: Ustvarite Googlov ID odjemalca in skrivnost odjemalca

Preden uporabite Google za prijavo uporabnikov v svojo aplikacijo, morate svojo aplikacijo registrirati pri Googlu, da pridobite ID odjemalca in skrivnost odjemalca, ki ju boste uporabili pri konfiguraciji Passport.

Prijavite se v Konzola Google Cloud in sledite naslednjim korakom, da registrirate svojo aplikacijo.

Ustvarite nov projekt. V menijski vrstici izberite Poverilnice in na spustnem seznamu izberite ID odjemalca OAuth.

Za vrsto aplikacije izberite Spletna aplikacija. V polje Ime dodajte želeno ime za svojo aplikacijo.

Pod pooblaščenimi URI-ji za preusmeritev uporabite http://localhost: 3000 in http://localhost: 3000/auth/google/callback za pooblaščene URI-je preusmeritve.

Kliknite ustvariti ustvariti odjemalca OAuth. Ker so poverilnice aplikacije občutljive, boste morali ustvariti a .env datoteko in ji dodajte ID odjemalca in skrivnost odjemalca.

CLIENT_ID = 
CLIENT_SECRET = 

2. korak: Nastavite strežnik Node

Ustvarite mapo, user-google-auth, in se pomaknite do njega.

mkdir uporabnik-google-avth
cd uporabnik-google-avth

Inicializiraj npm ustvariti package.json.

npm init -y

Ker boste uporabljali express za ustvarite strežnik, ga namestite tako, da zaženete naslednji ukaz.

npm install express

Odprite mapo z želenim urejevalnikom besedil in ustvarite novo datoteko app.js. Služil bo kot vstopna točka vaše aplikacije.

Ustvarite strežnik NodeJS v app.js.

const express = zahteva ("express");
const app = express();
const PORT = 3000;
app.listen (PORT, () => {
 console.log(`Poslušanje na vratih ${PORT}`);
});

2. korak: Nastavite MongoDB

Uporabniške podatke, prejete od Googla, boste shranili v a Baza podatkov MongoDB. Preden shranite podatke o uporabniku, morate določiti strukturo, v kateri bodo podatki shranjeni. Mongos je kot nalašč za to. Zagotavlja precej preprost način ustvarjanja podatkovnih modelov.

Namestite mungos.

npm namestite mongoose

Ustvarite novo datoteko userModel.jsin ustvarite uporabniško shemo.

const mongoose = require("mongoose");
const { Shema } = mongoose.model;
const UserSchema = nova shema({
 google: {
 id: {
 vrsta: vrvica,
 },
 ime: {
 vrsta: vrvica,
 },
 E-naslov: {
 vrsta: vrvica,
 },
 },
});
const Uporabnik = mongoose.model("Uporabnik", Uporabniška shema);
module.exports = Uporabnik;

V userModel.js, ste uvozili mungosa in ustvarili novo shemo.

Upoštevajte, da združujete podatke iz Googla. To je še posebej uporabno, če uporabljate tudi druge metode preverjanja pristnosti in uporabnik uporablja več kot eno. To olajša preprečevanje dvojne registracije.

Nato ustvarite db.js.

const mongoose = require("mongoose");
mungos. Obljuba = globalna. Obljuba;
const dbUrl = "mongodb://localhost/user";
const connect = async () => {
 mongoose.connect (dbUrl, { useNewUrlParser: true, useUnifiedTopology: true });
 const db = mungoose.connection;
 db.on("napaka", () => {
 console.log("ni mogoče vzpostaviti povezave");
 });
 db.once("odprto", () => {
 console.log("> Uspešno povezan z bazo podatkov");
 });
};
module.exports = { poveži};

Povežite se z bazo podatkov v app.js.

const express = zahteva ("express");
const app = express();
const PORT = 3000;
const db = zahteva ("./db");
db.connect();
app.listen (PORT, () => {
 console.log(`Poslušanje na vratih ${PORT}`);
});

3. korak: Nastavite potni list

Namestite potni list in potni list-google-oauth2.

npm i potni list passport-google-oauth2

Ustvarite novo datoteko, passportConfig.js, in uvozite Googlovo strategijo iz potni list-google-oauth2 in userModel.js.

const GoogleStrategy = require("passport-google-oauth2").Strategija;
const Uporabnik = zahteva ("./userModel");

Za konfiguracijo uporabite poverilnice aplikacije potni list z Googlovim OAuthom.

module.exports = (potni list) => {
 passport.use (nova GoogleStrategy({
 ID odjemalca: process.env. CLIENT_ID,
 clientSecret: process.env. CLIENT_SECRET,
 callbackURL: " http://localhost: 3000/auth/google/callback",
 passReqToCallback: res
 },
 async (zahteva, accessToken, refreshToken, profil, končano) => {
 poskusi {
 naj obstoječiUser = čakaj User.findOne({ 'google.id': profile.id });
// če uporabnik obstaja, vrni uporabnika
 če (obstoječi uporabnik) {
 vrnitev opravljeno (nič, obstoječiUser);
 }
// če uporabnik ne obstaja ustvari novega uporabnika
 console.log('Ustvarjanje novega uporabnika...');
 const newUser = nov uporabnik({
 metoda: 'google',
 google: {
 id: profile.id,
 ime: profile.displayName,
 e-pošta: profile.emails[0].value
 }
 });
 počakaj na novegaUser.save();
 vrnitev opravljeno (null, newUser);
 } ulov (napaka) {
 vrnitev opravljeno (napaka, napačno)
 }
 }
 ));
}

Ko od Googla prejmete podatke o profilu, preverite, ali uporabnik obstaja v bazi podatkov. Če to storijo, preprosto vrnite najdenega uporabnika. Če je uporabnik nov, ustvarite nov dokument v bazi podatkov in vrnite ustvarjenega uporabnika.

Upoštevajte, da delate z env spremenljivke, zato uporabite npm paket dotenv za dostop do njih v svoji aplikaciji.

Namestite dotenv.

npm namestite dotenv

Uporaba dotenv v app.js.

Zahtevaj("dotenv").config()

V app.js, mimo potni list do passportConfig.js

const potni list = zahteva ("potni list");
zahtevaj("./passportConfig")(potni list);

4. korak: Ustvarite poti za preverjanje pristnosti

Potrebujete tri poti do:

• Preusmeri uporabnika na stran za prijavo v Google, da dobi žeton za dostop.
• Pridobite uporabniške podatke s prejetim žetonom za dostop.
• Po tem preusmerite uporabnika na stran profila uspešno preverjanje pristnosti.

// Preusmeri uporabnika na stran za prijavo v Google
app.get(
 "/auth/google",
 passport.authenticate("google", { obseg: ["e-pošta", "profil"] })
);
// Pridobite uporabniške podatke s prejetim žetonom za dostop
app.get(
 "/auth/google/callback",
 passport.authenticate("google", { session: false }),
 (req, res) => {
 res.redirect("/profil/");
 }
);
// profilna pot po uspešni prijavi
app.get("/profile", (req, res) => {
 console.log (req);
 res.send("Dobrodošli");
});

5. korak: Zaščitite zasebne poti

Zdaj, ko ste prijavljeni kot uporabnik, kako lahko omejite nekatere dele vaše aplikacije samo na overjene uporabnike? Eden od načinov za to je uporaba spletnih žetonov JSON (JWT). JWT ponujajo varen način prenosa informacij. Za avtorizirati uporabnike z uporabo JWT-jev bo vaša aplikacija:

• Ustvarite žeton z uporabo uporabniških podatkov.
• Posredujte žeton uporabniku (uporabnik bo poslal žeton nazaj z zahtevami, ki potrebujejo avtorizacijo).
• Preverite vrnjeni žeton.
• Dovolite dostop uporabniku, če je predstavljeni žeton veljaven.

Namestite jsonwebtoken za delo z JWT.

npm namestite jsonwebtoken

V app.js, uvoz jsonwebtoken.

const jwt = zahteva ("jsonwebtoken")

Spremenite URL Googlovega povratnega klica, da podpišete uporabnika in ustvarite žeton.

app.get(
 "/auth/google/callback",
 passport.authenticate("google", { session: false }),
 (req, res) => {
 jwt.sign(
 {uporabnik: req.user},
 "skrivni ključ",
 { expiresIn: "1h" },
 (napaka, žeton) => {
 če (napaka) {
 vrni res.json({
 žeton: nič,
 });
 }
 res.json({
 žeton,
 });
 }
 );
 }
);

Če se prijavite, boste prejeli žeton.

Nato uporabite potni list-jwt, strategija JWT, ki jo zagotavlja Passport za preverjanje žetona in avtorizacijo uporabnikov.

npm install passport-jwt

V passportConfig.js, dodajte strategijo JWT.

const JwtStrategy = require("passport-jwt").Strategija;
const { ExtractJwt } = Zahtevaj("passport-jwt");
module.exports = (potni list) => {
 passport.use (nova GoogleStrategy(
// Googlova strategija
 );
 potni list.uporaba(
 nova strategija Jwt(
 {
 jwtFromRequest: ExtractJwt.fromHeader("avtorizacija"),
 secretOrKey: "secretKey",
 },
 async (jwtPayload, končano) => {
 poskusi {
// Izvleček uporabnika
 const uporabnik = jwtPayload.user;
 končano (nič, uporabnik); 
 } ulov (napaka) {
 opravljeno (napaka, napačno);
 }
 }
 )
 );
}

Tukaj izvlečete žeton iz avtorizacijske glave, kjer je shranjen – kar je veliko varneje kot shranjevanje v telo zahteve.

Ko je žeton preverjen, se uporabniški objekt pošlje nazaj v telo zahteve. Če želite pooblastiti uporabnike, dodajte vmesno programsko opremo za preverjanje pristnosti potnega lista JWT v zaščitene poti.

app.get(
 "/profil",
 passport.authenticate("jwt", { session: false }),
 (req, res, next) => {
 res.send("Dobrodošli");
 }
);

Zdaj bodo dostop dobile samo zahteve, ki zagotavljajo veljaven žeton.

Naslednji koraki

Ta vadnica vam je pokazala, kako lahko uporabite Passport za prijavo uporabnikov v vašo aplikacijo z njihovim Google Računom. Uporaba potnega lista je veliko enostavnejša od drugih obrazcev in z njegovo uporabo boste prihranili veliko časa.

Passport ponuja tudi druge strategije preverjanja pristnosti za uporabo z drugimi ponudniki identitete, kot sta Twitter in Facebook. Zato je vredno preveriti tudi te.

Preverjanje pristnosti uporabnika v NodeJS z uporabo potnega lista in MongoDB

Preberite Naprej

O avtorju