NodeJS Google-autentisering med pass och express

Om du någonsin har använt ditt Google-konto för att logga in på ett program så kanske du har märkt hur enkelt det är. Du behöver bara klicka på en knapp och behöver inte ange din e-postadress eller ditt lösenord. Även om detta verkar enkelt, är det som händer under huven ganska komplicerat. Men verktyg som Passport gör det lättare.

I den här handledningen kommer du att lära dig hur du implementerar Google-autentisering i Node med Passport och Express.

Vad är pass?

Pass (eller Passport.js) är en mellanprogramvara för nodautentisering som tillhandahåller mer än 500 strategier för autentisering av användare inklusive social autentisering med plattformar som Google och Twitter.

Du kommer att använda pass-google-oauth2 strategi för att autentisera användare på Google.

Skapa ett Google-autentiseringssystem i Node

Det här är en översikt över det autentiseringssystem du kommer att skapa:

• När en användare klickar på inloggningsknappen skickas de till Googles inloggningssida där de loggar in.
• Google kommer att omdirigera användaren till din applikation med en åtkomsttoken. Åtkomsttoken ger dig behörighet att komma åt användarens profilinformation.
  instagram viewer
• Skicka åtkomsttoken till Google för att få profildata.
• Skapa en ny användare eller hämta den befintliga användaren från databasen.
• Använd JWT för att skydda känsliga rutter.

Hur man ställer in Google-autentisering i NodeJS med hjälp av pass

Följ stegen nedan för att auktorisera användare med Google OAuth,

Steg 1: Skapa ett Google Client ID och Client Secret

Innan du använder Google för att logga in användare på din app måste du registrera din applikation hos Google för att få klient-ID och klienthemlighet att använda när du konfigurerar Passport.

Logga in på Google Cloud-konsol och följ följande steg för att registrera din app.

Skapa ett nytt projekt. Välj i menyraden Referenser och välj i rullgardinsmenyn OAuth-klient-ID.

För applikationstyp, välj webbapplikation. Lägg till önskat namn för din ansökan i fältet Namn.

Under auktoriserade omdirigerings-URI: er, använd http://localhost: 3000 och http://localhost: 3000/auth/google/callback för auktoriserade omdirigerings-URI: er.

Klick skapa för att skapa OAuth-klienten. Eftersom appens autentiseringsuppgifter är känsliga måste du skapa en .env fil och lägg till klient-ID och klienthemlighet till den.

CLIENT_ID = 
CLIENT_SECRET = 

Steg 2: Konfigurera nodserver

Skapa en mapp, user-google-auth, och navigera till den.

mkdir user-google-auth
cd user-google-auth

Initiera npm att skapa package.json.

npm init -y

Eftersom du kommer att använda express till skapa servern, installera det genom att köra följande kommando.

npm installera express

Öppna mappen med din föredragna textredigerare och skapa en ny fil app.js. Det kommer att fungera som startpunkten för din ansökan.

Skapa NodeJS-servern i app.js.

const express = require("express");
const app = express();
const PORT = 3000;
app.listen (PORT, () => {
 console.log(`Lyssnar på port ${PORT}`);
});

Steg 2: Konfigurera MongoDB

Du kommer att lagra användardata som tas emot från Google i en MongoDB databas. Innan du sparar användarinformationen måste du definiera strukturen i vilken data ska lagras. Mongoose är perfekt för detta. Det ger ett ganska enkelt sätt att skapa datamodeller.

Installera mungo.

npm installera mongoose

Skapa en ny fil userModel.jsoch skapa användarschemat.

const mongoose = require("mongoose");
const { Schema } = mongoose.model;
const UserSchema = new Schema({
 Google: {
 id: {
 typ: String,
 },
 namn: {
 typ: String,
 },
 e-post: {
 typ: String,
 },
 },
});
const User = mongoose.model("Användare", UserSchema);
module.exports = Användare;

I userModel.js, du har importerat mongoose och skapat ett nytt schema.

Lägg märke till att du grupperar informationen från Google. Detta är särskilt användbart när du också använder andra autentiseringsmetoder och en användare använder mer än en. Det gör det lättare att förhindra dubbelregistrering.

Skapa sedan db.js.

const mongoose = require("mongoose");
mungo. Löfte = globalt. Löfte;
const dbUrl = "mongodb://localhost/user";
const connect = asynkron () => {
 mongoose.connect (dbUrl, { useNewUrlParser: true, useUnifiedTopology: true });
 const db = mongoose.connection;
 db.on("error", () => {
 console.log("kunde inte ansluta");
 });
 db.once("öppen", () => {
 console.log("> Ansluten till databasen framgångsrikt");
 });
};
module.exports = { connect };

Anslut till databasen i app.js.

const express = require("express");
const app = express();
const PORT = 3000;
const db = require("./db");
db.connect();
app.listen (PORT, () => {
 console.log(`Lyssnar på port ${PORT}`);
});

Steg 3: Konfigurera pass

Installera pass och pass-google-oauth2.

npm i pass pass-google-oauth2

Skapa en ny fil, passportConfig.jsoch importera Google-strategin från pass-google-oauth2 och userModel.js.

const GoogleStrategy = require("passport-google-oauth2").Strategy;
const User = require("./userModel");

Använd dina appuppgifter för att konfigurera pass med Google OAuth.

module.exports = (pass) => {
 passport.use (ny GoogleStrategy({
 klient-ID: process.env. KLIENT ID,
 clientSecret: process.env. CLIENT_SECRET,
 callbackURL: " http://localhost: 3000/auth/google/callback",
 passReqToCallback: sant
 },
 async (request, accessToken, refreshToken, profile, done) => {
 Prova {
 låt existerande Användare = await User.findOne({ 'google.id': profile.id });
// om användaren finns returnera användaren
 if (existingUser) {
 return done (null, existerande användare);
 }
// om användaren inte finns skapa en ny användare
 console.log('Skapar ny användare...');
 const newUser = new User({
 metod: 'google',
 Google: {
 id: profil.id,
 namn: profile.displayName,
 e-post: profile.emails[0].value
 }
 });
 await newUser.save();
 return done (null, newUser);
 } fånga (fel) {
 returnera gjort (fel, falskt)
 }
 }
 ));
}

När du har fått profilinformationen från Google, kontrollera om användaren finns i databasen. Om de gör det, returnera helt enkelt den hittade användaren. Om användaren är ny, skapa ett nytt dokument i databasen och returnera den skapade användaren.

Observera att du arbetar med env variabler så använd npm paket dotenv för att komma åt dem i din applikation.

Installera dotenv.

npm installera dotenv

Använda sig av dotenv i app.js.

require("dotenv").config()

I app.js,passera pass till passportConfig.js

const pass = require("pass");
require("./passportConfig")(pass);

Steg 4: Skapa autentiseringsrutter

Du behöver tre vägar för att:

• Omdirigera användaren till Googles inloggningssida för att få åtkomsttoken.
• Hämta användardata med den mottagna åtkomsttoken.
• Omdirigera användaren till profilsidan efter framgångsrik autentisering.

// Omdirigera användaren till Googles inloggningssida
app.get(
 "/auth/google",
 passport.authenticate("google", { scope: ["e-post", "profil"] })
);
// Hämta användardata med den mottagna åtkomsttoken
app.get(
 "/auth/google/callback",
 passport.authenticate("google", { session: false }),
 (req, res) => {
 res.redirect("/profile/");
 }
);
// profilväg efter lyckad inloggning
app.get("/profile", (req, res) => {
 console.log (req);
 res.send("Välkommen");
});

Steg 5: Skydda privata rutter

Nu när du har loggat in som användare, hur kan du begränsa vissa delar av din applikation till endast autentiserade användare? Ett sätt att gå till väga är att använda JSON Web Tokens (JWTs). JWT erbjuder ett säkert sätt att överföra informationen. Till auktorisera användare med JWT: er kommer din applikation:

• Generera en token med hjälp av användardata.
• Skicka token till användaren (användaren skickar tillbaka token med förfrågningar som kräver auktorisering).
• Verifiera token som skickats tillbaka.
• Bevilja åtkomst till användaren om den visade token är giltig.

Installera jsonwebtoken att arbeta med JWT.

npm installera jsonwebtoken

I app.js, importera jsonwebtoken.

const jwt = require("jsonwebtoken")

Ändra Googles webbadress för återuppringning för att signera användaren och generera en token.

app.get(
 "/auth/google/callback",
 passport.authenticate("google", { session: false }),
 (req, res) => {
 jwt.sign(
 { user: req.user },
 "hemlig nyckel",
 { expiresIn: "1h" },
 (fel, token) => {
 if (fel) {
 returnera res.json({
 token: null,
 });
 }
 res.json({
 tecken,
 });
 }
 );
 }
);

Om du loggar in får du token.

Använd sedan pass-jwt, en JWT-strategi som tillhandahålls av Passport för att verifiera token och auktorisera användare.

npm installera passport-jwt

I passportConfig.js, lägg till JWT-strategin.

const JwtStrategy = require("passport-jwt").Strategy;
const { ExtractJwt } = require("passport-jwt");
module.exports = (pass) => {
 passport.use (ny GoogleStrategy(
// Googles strategi
 );
 passport.use(
 ny JwtStrategy(
 {
 jwtFromRequest: ExtractJwt.fromHeader("auktorisation"),
 secretOrKey: "secretKey",
 },
 async (jwtPayload, klar) => {
 Prova {
// Extrahera användare
 const användare = jwtPayload.user;
 gjort (null, användare); 
 } fånga (fel) {
 gjort (fel, falskt);
 }
 }
 )
 );
}

Här extraherar du token från auktoriseringshuvudet där det lagras - vilket är mycket säkrare än att lagra det i förfrågan.

När token har verifierats skickas användarobjektet tillbaka till förfrågan. För att auktorisera användare, lägg till passet JWT-autentiseringsmellanvara till skyddade rutter.

app.get(
 "/profil",
 passport.authenticate("jwt", { session: false }),
 (req, res, nästa) => {
 res.send("Välkommen");
 }
);

Nu kommer endast förfrågningar som tillhandahåller en giltig token att få åtkomst.

Nästa steg

Den här handledningen visade hur du kan använda Passport för att logga in användare på din applikation med deras Google-konto. Att använda Passport är mycket enklare än andra former, och du kommer att spara mycket tid genom att använda det.

Passport tillhandahåller också andra autentiseringsstrategier att använda med andra identitetsleverantörer, som Twitter och Facebook. Så det är värt att kolla upp dem också.

Användarautentisering i NodeJS med Passport och MongoDB

Läs Nästa

Om författaren