@c15t/astro

中文文档
3.2.2发布于 2026/11/02Apache-2.0TypeScriptES Module构建来源已验证近 30 天下载 8.1万

Astro cookie consent banner for c15t, with server-rendered markup, preference center islands and geo-aware middleware.

原始使用文档
文档目录11 节
  1. Key Features
  2. Prerequisites
  3. Installation
  4. Usage
  5. Run c15t on Inth
  6. Documentation
  7. Docs for AI Agents
  8. Support
  9. Contributing
  10. Security
  11. License

c15t: the open standard for cookie banners

@c15t/astro: Astro cookie banner and cookie consent management

Latest NPM Version Stars License Discord Skills Made by Inth

Cookie banner, preference dialog, and consent-gated scripts for Astro 5, 6, and 7. Middleware resolves each request's consent policy, such as GDPR opt-in in the EU. The banner is plain .astro markup with no framework JavaScript. The preference dialog loads as a Svelte, React, or Vue island only when a visitor opens it.

c15t is used by 2,100+ sites, including expo.dev, zed.dev, unkey.dev, mintlify.com, and sazabi.com.

Key Features

  • Visitors download no UI framework for the banner. The dialog's framework loads only when a visitor opens it
  • Write the dialog island in Svelte, React, or Vue, so it uses the framework your site already ships
  • Static output works on any static host with hosted(). Server output resolves each visitor's policy, so the banner is in the first HTML
  • Geo-aware middleware reads location and language headers from your host
  • Analytics, ads, and pixels follow each visitor's choice through @c15t/integrations: Google Tag Manager, Google Consent Mode v2, GA4, Meta Pixel, PostHog, and more
  • IAB TCF 2.4 banner and dialog components

Prerequisites

  • Astro 5, 6, or 7
  • One of @astrojs/svelte, @astrojs/react, or @astrojs/vue for the preference dialog
  • A server adapter for server output, or none for static output
  • An Inth project (free sign-up). For development and tests, local mode needs no backend

Installation

pnpm add c15t @astrojs/svelte svelte @astrojs/node

The c15t package re-exports this package at c15t/astro, and the docs use that path. For React or Vue dialogs, install @astrojs/react react react-dom or @astrojs/vue vue instead of Svelte. @astrojs/node is the server adapter in the example below. Use your host's adapter instead, or leave it out for static output.

Usage

  1. Set PUBLIC_C15T_BACKEND_URL to your Inth backend URL in .env
  2. Register your UI framework, then c15t(), in astro.config.mjs
// astro.config.mjs
import node from '@astrojs/node'
import svelte from '@astrojs/svelte'
import { defineConfig } from 'astro/config'
import c15t from 'c15t/astro'

export default defineConfig({
  adapter: node({ mode: 'standalone' }),
  integrations: [svelte(), c15t()],
  output: 'server',
})
  1. Add ConsentScript to <head>, and ConsentBanner, ConsentDialog, and ConsentDialogLink to your layout, from c15t/astro/components
  2. For static output, the full layout, and island options, see the Astro quickstart

Run c15t on Inth

c15t needs a backend to serve policies and keep consent records. Inth runs it for you. It stores every choice with its region and policy version, audits your live site and pull requests for privacy risk, and on Pro and above keeps each region's consent rules current with managed policy packs. You don't run the consent database, geo lookups, uptime, or upgrades.

Sign-up is free. Run npx @inth/cli c15t to create a project and set up c15t, or create one by hand and copy its backend URL.

For development and tests, local mode keeps choices in the browser and keeps no consent records. Don't ship it to production. Its factory is local(). The old name, offline(), still works and goes away in v4.

Documentation

See the documentation for guides, API reference, and examples.

Docs for AI Agents

This package ships its documentation as Markdown, matched to the installed version. After you install it, point your coding agent at node_modules/@c15t/astro/AGENTS.md. It indexes every guide in node_modules/@c15t/astro/docs/.

On the web, every page of the c15t docs has a Markdown version, and llms.txt lists them all. Install the c15t agent skills with npx skills add c15t/skills.

Support

Contributing

Security

Do not open a public issue for a security vulnerability. Report it privately through GitHub's vulnerability reporting. We examine every valid report.

  • Do not share the vulnerability in public forums, issues, or pull requests
  • Give the steps to reproduce it and the versions it affects
  • Give us time to release a fix before you disclose it

License

Apache License 2.0


Built by Inth

版本与发布记录

@c15t/astro 共发布 21 个版本,首次发布于 2026/09/15;过去 12 个月发布了 21 个版本。最新版本附带 npm provenance 构建来源证明,可追溯到公开的 CI 构建记录。

版本发布日期距今
3.2.2latest2026/11/027 天前
3.2.12026/10/319 天前
3.2.02026/10/3010 天前
3.2.0-canary.0canary2026/10/2316 天前
3.1.02026/10/1723 天前
3.1.0-canary.02026/10/1525 天前

其他发布通道:alpha → 3.0.0-alpha.12,canary → 3.2.0-canary.0。

关于 @c15t/astro 的常见问题

@c15t/astro 是什么?

Astro cookie consent banner for c15t, with server-rendered markup, preference center islands and geo-aware middleware.

如何安装 @c15t/astro?

在项目目录运行 npm install @c15t/astro,或使用 pnpm add / yarn add / bun add。

@c15t/astro 支持 TypeScript 吗?

支持。包内自带 TypeScript 类型声明(package.json 声明了 types 入口),安装后即可获得类型提示,无需再安装 @types 包。

@c15t/astro 支持 ESM 还是 CommonJS?

以 ES Module 形式发布,推荐使用 import 引入。在 CommonJS 项目中,Node.js 20.19+ / 22.12+ 可以直接 require() 不含顶层 await 的 ES Module,更早的版本需要改用动态 import()。

@c15t/astro 可以商用吗?

@c15t/astro 使用 Apache-2.0 许可。宽松许可:允许商业使用、修改和再分发,并附带明确的专利授权;分发时需保留许可与 NOTICE 文件,修改过的文件要注明改动。以上为概括,不构成法律意见,请以许可原文为准。

@c15t/astro 的下载量有多少?

根据 npm 官方下载统计,@c15t/astro 在 2026/10/09 – 2026/11/07 这 30 天内被下载 81,301 次,日均约 2,710 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入,适合横向比较热度,不能直接等同于使用人数。

@c15t/astro 还在维护吗?

最新版本 3.2.2 发布于 2026/11/02(7 天前);至今共发布 21 个版本,其中过去 12 个月发布了 21 个;首次发布于 2026/09/15。发布频率只是参考信号:功能稳定的工具可能很少需要更新,建议结合源码仓库的 issue 和提交记录判断。