Полезные ссылки
- The new Cookie Store API от 14.04.2025
- Документация на MDN
В браузере у нас есть устоявшийся способ работы с куками – document.cookie, но API по работе с ними не самое удобное:
// Записываем куку со значением темы
document.cookie = "theme=dark; max-age=31536000; path=/";
// Читаем куку со значением темы
const cookies = Object.fromEntries(
document.cookie.split(";").map((cookie) => {
const preparedCookie = cookie.trim();
const delimiterPos = preparedCookie.indexOf("=");
return [
preparedCookie.slice(0, delimiterPos),
preparedCookie.slice(delimiterPos + 1),
];
}),
);
const theme = cookies["theme"] ?? "light";С новым CookieStore API работать с куками становится очень легко:
await cookieStore.set({
name: "theme",
value: "dark",
expires: Date.now() + 31536000,
});
const { value: theme } = await cookieStore.get("theme");Помимо удобного и понятного декларативного API, мы получили возможность отследить, что кука поменялась или была удалена, или вообще подписаться на изменение всех кук страницы с помощью CookieStorageManager. И это сработает даже в том случае, если кука была изменена на другой странице.
Единственный минус – фича только появилась в Firefox Nightly 139 и наполовину в свежем Safari 18.4.
