Ако някога сте използвали акаунта си в Google, за да влезете в приложение, може би сте забелязали колко лесно е това. Трябва само да щракнете върху един бутон и не е нужно да въвеждате своя имейл или парола. Въпреки че това изглежда просто, това, което се случва под капака, е доста сложно. Инструменти като Passport обаче го правят по-лесно.

В този урок ще научите как да приложите удостоверяване на Google в Node с помощта на Passport и Express.

Какво е паспорт?

Паспорт (или Passport.js) е междинен софтуер за удостоверяване на Node, който предоставя повече от 500 стратегии за удостоверяване на потребители, включително социално удостоверяване с помощта на платформи като Google и Twitter.

Вие ще използвате passport-google-oauth2 стратегия за удостоверяване на потребители в Google.

Създаване на система за удостоверяване на Google в Node

Това е преглед на системата за удостоверяване, която ще създадете:

  • Когато потребител щракне върху бутона за вход, той ще бъде изпратен на страницата за вход в Google, където ще влезе.
  • instagram viewer
  • Google ще пренасочи потребителя към вашето приложение с токен за достъп. Токенът за достъп ви дава разрешение за достъп до информацията в профила на този потребител.
  • Изпратете токена за достъп до Google, за да получите данните за потребителския профил.
  • Създайте нов потребител или извлечете съществуващия потребител от базата данни.
  • Използвайте JWT за защита на чувствителни маршрути.

Как да настроите удостоверяване на Google в NodeJS с помощта на паспорт

Следвайте стъпките по-долу, за да упълномощите потребители с Google OAuth,

Стъпка 1: Създайте клиентски идентификатор на Google и клиентска тайна

Преди да използвате Google за влизане на потребители в приложението си, трябва да регистрирате приложението си в Google, за да получите клиентския идентификатор и тайната на клиента, които да използвате при конфигуриране на Passport.

Влезте в Google Cloud конзола и следвайте следните стъпки, за да регистрирате приложението си.

Създайте нов проект. В лентата с менюта изберете Акредитивни писма и от падащия списък изберете OAuth клиентски идентификатор.

За типа приложение изберете Уеб приложение. Добавете предпочитаното име за вашето приложение в полето Име.

Под разрешени URI за пренасочване използвайте http://localhost: 3000 и http://localhost: 3000/auth/google/обратно повикване за оторизирани URI за пренасочване.

Щракнете върху създавай за да създадете OAuth клиента. Тъй като идентификационните данни на приложението са чувствителни, ще трябва да създадете a .env файл и добавете клиентския идентификатор и тайната на клиента към него.

CLIENT_ID = 

CLIENT_SECRET =

Стъпка 2: Настройте Node Server

Създайте папка, user-google-auth, и навигирайте до него.

mkdir потребител-google-auth
cd потребител-google-auth

Инициализирайте npm да създам package.json.

npm init -y

Тъй като ще използвате експрес за създайте сървъра, инсталирайте го, като изпълните следната команда.

npm install express

Отворете папката с предпочитания от вас текстов редактор и създайте нов файл app.js. Той ще служи като входна точка на вашето приложение.

Създайте NodeJS сървъра в app.js.

const express = изисквам ("експрес");
const app = express();
const PORT = 3000;
app.listen (PORT, () => {
console.log(`Слушане на порт ${PORT}`);
});

Стъпка 2: Настройте MongoDB

Ще съхранявате потребителските данни, получени от Google в a База данни MongoDB. Преди да запазите потребителската информация, трябва да дефинирате структурата, в която ще се съхраняват данните. Мангустът е идеален за това. Той предоставя доста лесен начин за създаване на модели на данни.

Инсталирай мангуста.

npm инсталирайте mongoose

Създайте нов файл userModel.jsи създайте потребителската схема.

const mongoose = изисквам("мангуст");
const { Схема } = mongoose.model;
const UserSchema = нова схема ({
google: {
документ за самоличност: {
тип: низ,
},
име: {
тип: низ,
},
електронна поща: {
тип: низ,
},
},
});
const Потребител = mongoose.model("Потребител", потребителска схема);
module.exports = Потребител;

В userModel.js, сте импортирали мангуста и сте създали нова схема.

Забележете, че групирате информацията от Google. Това е особено полезно, когато използвате и други методи за удостоверяване и потребителят използва повече от един. Това прави предотвратяването на двойна регистрация по-лесно.

След това създайте db.js.

const mongoose = изисквам("мангуст");
мангуста. Обещание = глобално. обещание;
const dbUrl = "mongodb://localhost/user";
const connect = async () => {
mongoose.connect (dbUrl, { useNewUrlParser: true, useUnifiedTopology: true });
const db = mongoose.connection;
db.on("грешка", () => {
console.log("не може да се свърже");
});
db.once("отворено", () => {
console.log("> Успешно свързан с базата данни");
});
};
module.exports = { свържете };

Свържете се с базата данни в app.js.

const express = изисквам ("експрес");
const app = express();
const PORT = 3000;
const db = изисквам ("./db");
db.connect();
app.listen (PORT, () => {
console.log(`Слушане на порт ${PORT}`);
});

Стъпка 3: Настройте паспорт

Инсталирай паспорт и passport-google-oauth2.

npm i паспорт passport-google-oauth2

Създайте нов файл, passportConfig.js, и импортирайте стратегията на Google от passport-google-oauth2 и userModel.js.

const GoogleStrategy = require("passport-google-oauth2").Strategy;
const Потребител = изисква ("./userModel");

Използвайте идентификационните данни на приложението си, за да конфигурирате паспорт с Google OAuth.

module.exports = (паспорт) => {
passport.use (нова GoogleStrategy({
clientID: process.env. CLIENT_ID,
clientSecret: process.env. CLIENT_SECRET,
URL за обратно повикване: " http://localhost: 3000/auth/google/обратно повикване",
passReqToCallback: вярно
},
async (заявка, accessToken, refreshToken, профил, готово) => {
опитвам {
нека съществуващUser = await User.findOne({ 'google.id': profile.id });
// ако потребителят съществува връщаме потребителя
ако (съществуващ потребител) {
връщане готово (нула, съществуващ потребител);
}
// ако потребител не съществува, създайте нов потребител
console.log('Създаване на нов потребител...');
const newUser = нов потребител({
метод: 'google',
google: {
идентификатор: profile.id,
име: profile.displayName,
имейл: profile.emails[0].value
}
});
чакам newUser.save();
връщане готово (null, newUser);
} улов (грешка) {
връщане готово (грешка, невярно)
}
}
));
}

След като получите информацията за профила от Google, проверете дали потребителят съществува в базата данни. Ако го направят, просто върнете намерения потребител. Ако потребителят е нов, създайте нов документ в базата данни и върнете създадения потребител.

Имайте предвид, че работите с окр променливи, така че използвайте npm пакет dotenv за достъп до тях във вашето приложение.

Инсталирай dotenv.

npm инсталирайте dotenv

Използвайте dotenv в app.js.

изисквам("dotenv").config()

В app.js, пас паспорт да се passportConfig.js

const passport = изисквам ("паспорт");
изисквам("./passportConfig")(паспорт);

Стъпка 4: Създайте маршрути за удостоверяване

Имате нужда от три маршрута за:

  • Пренасочете потребителя към страницата за вход в Google, за да получите токена за достъп.
  • Извличане на потребителски данни с помощта на получения токен за достъп.
  • След това пренасочете потребителя към страницата на профила успешно удостоверяване.
// Пренасочване на потребителя към страницата за влизане в Google
app.get(
"/auth/google",
passport.authenticate("google", { обхват: ["имейл", "профил"] })
);
// Извличане на потребителски данни с помощта на получения токен за достъп
app.get(
"/auth/google/обратно повикване",
passport.authenticate("google", { session: false }),
(req, res) => {
res.redirect("/профил/");
}
);
// маршрут на профила след успешно влизане
app.get("/profile", (req, res) => {
console.log (req);
res.send("Добре дошли");
});

Стъпка 5: Защитете частните маршрути

След като вече сте влезли като потребител, как можете да ограничите някои части от приложението си само до удостоверени потребители? Един от начините да направите това е използването на JSON уеб токени (JWT). JWT предлагат сигурен начин за предаване на информацията. Да се оторизира потребители използвайки JWT, вашето приложение ще:

  • Генерирайте токен, използвайки потребителските данни.
  • Предайте токена на потребителя (потребителят ще изпрати обратно токена със заявки, които се нуждаят от оторизация).
  • Проверете изпратения обратно токен.
  • Предоставете достъп на потребителя, ако представеният токен е валиден.

Инсталирай jsonwebtoken за работа с JWT.

npm инсталирайте jsonwebtoken

В app.js, внос jsonwebtoken.

const jwt = изисквам ("jsonwebtoken")

Променете URL адреса за обратно извикване на Google, за да подпишете потребителя и да генерирате токен.

app.get(
"/auth/google/обратно повикване",
passport.authenticate("google", { session: false }),
(req, res) => {
jwt.sign(
{ потребител: req.user },
"таен ключ",
{ expiresIn: "1h" },
(грешка, символ) => {
ако (грешка) {
върне res.json({
токен: нула,
});
}
res.json({
жетон,
});
}
);
}
);

Ако влезете, ще получите токена.

След това използвайте паспорт-jwt, JWT стратегия, предоставена от Passport за проверка на токена и оторизиране на потребители.

npm инсталирайте passport-jwt

В passportConfig.js, добавете стратегията JWT.

const JwtStrategy = require("passport-jwt").Стратегия;
const { ExtractJwt } = изисквам ("passport-jwt");
module.exports = (паспорт) => {
passport.use (нова GoogleStrategy(
// Стратегия на Google
);
passport.use(
нова JwtStrategy(
{
jwtFromRequest: ExtractJwt.fromHeader("упълномощаване"),
secretOrKey: "secretKey",
},
async (jwtPayload, готово) => {
опитвам {
// Извличане на потребител
const потребител = jwtPayload.user;
готово (нула, потребител);
} улов (грешка) {
направено (грешка, невярно);
}
}
)
);
}

Тук извличате маркера от заглавката за оторизация, където се съхранява – което е много по-безопасно, отколкото да го съхранявате в тялото на заявката.

След като маркерът бъде проверен, потребителският обект се изпраща обратно към тялото на заявката. За да оторизирате потребители, добавете междинния софтуер за удостоверяване на паспорт JWT към защитените маршрути.

app.get(
"/профил",
passport.authenticate("jwt", { session: false }),
(req, res, next) => {
res.send("Добре дошли");
}
);

Сега достъп ще получат само заявки, които предоставят валиден токен.

Следващи стъпки

Този урок ви показа как можете да използвате Passport за влизане на потребители във вашето приложение чрез техния акаунт в Google. Използването на паспорт е много по-лесно от другите формуляри и ще спестите много време чрез използването му.

Passport също така предоставя други стратегии за удостоверяване за използване с други доставчици на идентичност, като Twitter и Facebook. Така че си струва да проверите и тях.

Удостоверяване на потребителя в NodeJS с помощта на Passport и MongoDB

Прочетете Следващото

ДялтуитДялелектронна поща

Свързани теми

  • Програмиране
  • Сигурност
  • Програмиране
  • Инструменти за програмиране
  • Google
  • Google Authenticator

За автора

Мери Гатони (публикувани 11 статии)

Мери Гатони е разработчик на софтуер със страст за създаване на техническо съдържание, което е не само информативно, но и ангажиращо. Когато не кодира или пише, тя обича да излиза с приятели и да е на открито.

Още от Mary Gathoni

Абонирайте се за нашия бюлетин

Присъединете се към нашия бюлетин за технически съвети, ревюта, безплатни електронни книги и ексклузивни оферти!

Щракнете тук, за да се абонирате