import PackageManagerTabs from '/components/tabs/PackageManagerTabs.astro' import ReadMore from '/components/ReadMore.astro'

Аутентификация и авторизация — это два процесса безопасности, которые управляют доступом к вашему веб-сайту или приложению. Аутентификация проверяет личность посетителя, а авторизация предоставляет доступ к защищенным областям и ресурсам.

Аутентификация позволяет настраивать области вашего сайта для авторизованных пользователей и обеспечивает наивысшую защиту для личной или конфиденциальной информации. Библиотеки аутентификации (например, Lucia Auth, Auth.js) предоставляют утилиты для различных методов аутентификации, таких как вход по электронной почте и OAuth-провайдеры.

:::tip Официального решения для аутентификации в Astro нет, но вы можете найти "auth" интеграции сообщества в каталоге интеграций. :::

Узнайте, как добавить аутентификацию с помощью Supabase или добавить аутентификацию с помощью Firebase в наших специальных руководствах по этим бэкэнд-сервисам.

Lucia

Lucia — это библиотека аутентификации на основе сессий, не зависящая от фреймворка, с отличной поддержкой Astro.

Установка

Установите Lucia с помощью выбранного вами менеджера пакетов.

Конфигурация

Используйте руководство Lucia "Getting started in Astro" для инициализации Lucia с адаптером и настройки базы данных для хранения пользователей и сессий.

Использование

:::tip Следуйте одному из полных руководств Lucia по Astro, чтобы добавить аутентификацию по имени пользователя и паролю или GitHub OAuth в ваш проект Astro. :::

Следующие шаги

• Пример проекта Astro + Lucia OAuth
• Пример проекта Astro + Lucia с использованием имени пользователя и пароля

Auth.js

Auth.js — это решение для аутентификации, не зависящее от фреймворка. Для Astro доступен адаптер фреймворка сообщества auth-astro.

Установка

Используйте команду astro add в предпочитаемом менеджере пакетов для добавления интеграции auth-astro.

Ручная установка

Чтобы установить auth-astro вручную, установите требуемый пакет для вашего менеджера пакетов:

Затем примените интеграцию к вашему файлу astro.config.* с помощью свойства integrations:

import { defineConfig } from 'astro/config';import auth from 'auth-astro';export default defineConfig({  // ...  integrations: [auth()],});

Конфигурация

Создайте файл auth.config.mjs в корне вашего проекта. Добавьте любых поставщиков аутентификации или методы, которые вы хотите поддерживать, вместе с любыми переменными среды, которые они требуют.

import GitHub from '@auth/core/providers/github';import { defineConfig } from 'auth-astro';export default defineConfig({	providers: [		GitHub({			clientId: import.meta.env.GITHUB_CLIENT_ID,			clientSecret: import.meta.env.GITHUB_CLIENT_SECRET,		}),	],});

Создайте файл .env в корне проекта, если его еще нет. Добавьте следующие две переменные окружения. AUTH_SECRET должна быть закрытой строкой, состоящей минимум из 32 символов.

AUTH_TRUST_HOST=trueAUTH_SECRET=<my-auth-secret>

Использование

Вы можете добавить кнопки входа и выхода, используя модуль auth-astro/client в теге script или компоненте фреймворка на стороне клиента.

---import Layout from 'src/layouts/Base.astro';---<Layout>  <button id="login">Login</button>  <button id="logout">Logout</button>  <script>    const { signIn, signOut } = await import("auth-astro/client")    document.querySelector("#login").onclick = () => signIn("github")    document.querySelector("#logout").onclick = () => signOut()  </script></Layout>

Вы можете получить сессию пользователя с помощью метода getSession.

---import Layout from 'src/layouts/Base.astro';import { getSession } from 'auth-astro/server';const session = await getSession(Astro.request);---<Layout>  {    session ? (      <p>Welcome {session.user?.name}</p>    ) : (      <p>Not logged in</p>    )  }</Layout>

Следующие шаги

• auth-astro на GitHub
• Документация по Auth.js