@c15t/ svelte: 斯维尔特和斯维尔特基特饼干旗和饼干同意组件
Cookie横幅,同意对话框,以及Svelte 5和SvelteKit的首选中心. 配置基于位置的同意政策,例如欧盟访客的GDPR选入. 想要自己的设计时使用无头状态.
c15t用于 2 100个以上地点包括expo.dev, sed.dev, unkey.dev, mintlify.com, 和 sazabi.com.
关键特性
- 与斯维尔特5.20及以后,斯维尔特基特2和3合作
- 在斯维尔特基特,
loadConsent解决服务器上的策略, 因此横幅位于第一个 HTML - 预建 cookie 横幅、 同意对话框和优先选择中心
- 完全定制设计的无头状态
- 分析、广告和像素通过@c15t/整合跟踪每个访客的选择:Google Tag管理器、Google的同意模式v2、GA4、Meta像素、PostHog等
- 通过@c15t/翻译翻译53种语文
先决条件
- Svelte 5.20 或以后,或 SvelteKit 2 或 3
- 节点.js 20.19或以后
- 一个 内部项目 (免费报名). 对于开发和测试,本地模式不需要后端
安装
pnpm add c15t
安装 c15t 并导入 Svelte 组件 c15t/svelte。 。 。 .
要手动安装,请跟随 快速启动。 。 。 .
使用量
- 添加
consentManifest()从c15t/svelte/vite改为vite.config.ts它下载您的策略VITE_C15T_BACKEND_URL(斯维尔特基特:PUBLIC_C15T_BACKEND_URL(中文(简体) ) - 包装您的应用程序
ConsentProvider内manifest()模式 - 添加
ConsentBanner财务报告和审定财务报表ConsentDialog临近根 - 在斯维尔特基特, 渲染
ConsentRoot与州loadConsent从c15t/svelte/kit返回; 参见 SvelteKit 快速启动 - 关于完整的设置,见 快速启动文件
<!-- src/App.svelte -->
<script lang="ts">
import {
ConsentBanner,
ConsentDialog,
ConsentDialogLink,
ConsentProvider,
manifest,
} from 'c15t/svelte';
</script>
<ConsentProvider mode={manifest()}>
<main>Your app goes here.</main>
<ConsentBanner />
<ConsentDialog />
<ConsentDialogLink>Privacy settings</ConsentDialogLink>
</ConsentProvider>
在 Inth 上运行 c15t
c15t需要一个后端来服务政策和保存同意记录. 输入 为您运行它。 它把每个选择都储存在它的区域和政策版本中,审计你的现场,并拉动隐私风险请求,在Pro和以上上,每个地区的同意规则都有管理的政策包。 你不运行同意数据库, 地理检索, 上升时间,或升级.
注册是免费的。 运行 npx @inth/cli c15t 创建项目并设置 c15t,或用手创建并复制其后端 URL.
对于开发和测试,本地模式在浏览器中保留选择,不保存同意记录. 别把它运去生产 它的工厂 local()旧名, offline(),仍然工作,在v4离开.
文档
见 文档 用于指南、API参考和示例.
AI 代理文件
这个软件包以Markdown为载体,与已安装的版本相匹配。 安装后,请指定编码代理 node_modules/@c15t/svelte/AGENTS.md它将每个向导在 node_modules/@c15t/svelte/docs/。 。 。 .
在网络上,每页 c15吨文件 拥有Markdown版本,并且 页:1 全部列出 安装 c15t 代理技能 npx skills add c15t/skills。 。 。 .
支助
- 加入我们 Discord 社区
- 打开我们的问题 GitHub 仓库
- 访问 inth.com (英语) 并使用聊天部件
- 通过电子邮件联系我们的支援团队 支持@inth.com
捐款
警卫
不为安全弱点打开一个公共问题。 私下通过报告 GitHub 的脆弱性报告我们审查所有的报告.
- 不在公共论坛、议题或请求中分担脆弱性
- 给它复制的步骤 和它影响的版本
- 在你透露之前给我们点时间
许可证
由 输入