Как пользоваться cookie в NestJS и локальном фронте
Kesio
Posted on June 26, 2022
Пишу статьи для себя, что бы не забывать все, но может кому то тоже поможет.
Я написал backend на NestJS, все протестил однако когда решил писать frontend появились сразу проблемы, я не мог сохранить cookie в браузер и потом их прочитать с backend-а. В cookie я хранил jwt-токен.
Для начала нужно установить cookie-parser.
npm i cookie-parser @types/cookie-parser
После заходим в наш main.ts и изменяем его.
import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
import * as cookieParser from 'cookie-parser';
async function bootstrap() {
const PORT = 3001;
const app = await NestFactory.create(AppModule);
app.use(cookieParser()); // Подключаем
await app.listen(PORT, () => console.log(`http://localhost:${PORT}/`));
}
bootstrap();
Используем Response в Контроллере
@Post('login')
login(@Res({ passthrough: true }) res: Response) {
const jwt = "blablawdsfblabla"
res.cookie('jwt', jwt, { httpOnly: true, secure: false });
return {
message: 'success'
};
}
passthrough - При использование декоратора @Res вы теряете совместимость с функциями NestJS, поэтому чтобы их исправить вы добавляете passthrough: true
httpOnly - запрет на доступ к Cookie из JavaScript-а
secure - для доступа по http, т.е. отключаем защиту (Если поставить тру, то выйдет вот такая ошибка: POST http://localhost:3001/auth/login net::ERR_CONNECTION_REFUSED)
На frontend-е вам нужно будет использовать withCredentials
axios.post("http://localhost:3001/auth/login", {
email: "nurislam@mail.com",
password: "12345678"
}, {withCredentials: true})
Все, теперь у вас сохраняются куки в браузере, надеюсь помог кому то еще кроме себя. У меня будут в будущем еще статьи для нубов и меня.
Posted on June 26, 2022
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.