Защитить что-либо в Интернете сложно. Эта серия не гарантирует, что ваше приложение будет на 100% защищено от злоумышленников, но мы надеемся, что ваше приложение будет более безопасным, чем раньше.

Мы расскажем, как сохранить JWT в файле cookie и использовать его для вызова API в NextJ как на стороне клиента, так и на стороне сервера. Если вы хотите узнать больше о преимуществах JWT, jwt.io и JWT в Node.JS помогут вам.

Существует три основных способа хранения токенов JWT. LocalStorage, SessionStorage и файлы cookie.

LocalStorage. Храните значения в виде пар "ключ-значение" в веб-браузере без ограничения срока действия. Доступен через браузер.

SessionStorage: аналогично LocalStorage, но хранится только для сеанса. Если браузер или вкладка закрыты, данные теряются.

Файлы cookie. Все файлы cookie для домена хранятся в одной строке. Данные сохраняются на вкладках и при закрытии браузера. Доступны настройки для даты истечения срока действия, конкретной поддержки HTTPS и возможности доступа к ней через браузер.

Все вышеперечисленное может быть уязвимо для атак межсайтового скриптинга (XSS). XSS — это когда злоумышленник прикрепляет код к веб-сайту и крадет безопасный токен аутентификации пользователя.

Как можно украсть токен через XSS?

  1. У вас есть сайт — www.mywebsite.com.
  2. Злоумышленник отправляет пользователю по электронной почте ссылку, к концу URL которой прикреплен вредоносный код. www.mywebsite.com/{maliciousCode}
  3. Вредоносный код получает доступ к токену JWT пользователя и отправляет токен злоумышленнику. Злоумышленник теперь может получить доступ к вашим API, выдавая себя за пользователя, у которого был взят токен.

Как мы можем предотвратить XSS?

У файлов cookie есть опция Http-Only. Это предотвращает доступ к ним в браузере и будет отправляться только в вызовах API из вашего приложения. Это основной способ защиты вашего сайта от XSS-атак.

У файлов cookie есть еще одна опция (обычно для производства), Secure, что означает, что файл cookie отправляется в запросе API только в том случае, если он https. Флаг безопасности нельзя установить, если сайт небезопасен (http)

В этой серии будет показано, как вы можете отправлять файлы cookie только для HTTP из API; как настроить свою среду для их использования и отправки в запросах API на стороне клиента и на стороне сервера.

Безопасная аутентификация API с помощью серии NextJs

1. Только файлы cookie HTTP

2. Set-Cookie из API

3. Сервер разработки

4. Маршрутизация микросервиса на тот же порт (необязательно)

5. Вызовы API на стороне клиента и на стороне сервера

6. Токен доступа против токенов обновления