@ebitex/内容-sdk
已发布 ebitex 语录 从您自己的站点获取的内容 : 内容发送 API 和 React 功能,通过发送每个功能实现发送页面 介绍到您提供的组件 .
两个切入点:
@ebitex/content-sdk——客户.createDeliveryClient是一个方法,每个终点;createContentClient添加网站/地点/内容解析度、解析策略、缓存和 取消,和resolveLocation(location)以调用每个路由器更改。 没有反应.@ebitex/content-sdk/react—— 说<ContentProvider>, (中文(简体) ),<Experience>, (中文(简体) ),<RenderPresentation>, (中文(简体) ),<PresentationList>, (中文(简体) ),<RichText>, (中文(简体) ),<Resolve>和每个演示的向导 这无法证明。 反应是一种同伴依赖,从未捆绑.
为什么要用这个 而不是自己给API打电话
一个写自己的网站 fetch 与交付API对应的代码 拥有下面所有的东西,没有
显示直到有东西断裂。 这个软件包是所有软件的维护版本:
- 每个端点, 键入,与 API 保持一致:路径分辨率、组件、流和侧面, 媒体和反应分析.
- 弹片.
buildSitemapDocuments(单位:千美元)@ebitex/content-sdk/sitemap在协议限制, 写入索引并发送hreflang替代, 所以你不会手动加入 URL . - 现场预览并点击到编辑.
@ebitex/content-sdk/preview是接收器、上盖和针头。 这个 需要预览会话的附加说明的回复,该客户端只解析其字段 使丢弃. - - 地方地址 - 是的 - Listene address. 地址在路径前缀下已包含其语言 本地主机策略。 一个客户端增加了自己的前缀将它翻倍.
- 吊车和参考文献. 带有右键的缓存,以及
resolve处理如此交付 介绍从来不是空洞的参考.
将手写客户端移动过来,可以一步一步地完成,保存自己的渲染器:见
替换手写客户端。 。 。 .
用于.NET,使用 Ebitex.Content.Delivery。 。 。 .
A 类 浏览器安全 交付密钥(一种带有允许来源或允许范围的限制) 船装一捆。 既无限制的密钥是 服务器侧密钥 永远不能到达 浏览器. 在“内容”中创建“交付”.
安装
npm install @ebitex/content-sdk
快开始
import { createContentClient } from '@ebitex/content-sdk'
import { ContentProvider, Experience, renderersFromGlob } from '@ebitex/content-sdk/react'
const content = createContentClient({ apiKey: import.meta.env.VITE_CONTENT_DELIVERY_KEY })
const renderers = renderersFromGlob(import.meta.glob('./presentations/*.tsx'))
export function App() {
const location = useLocation()
const navigate = useNavigate()
return (
<ContentProvider client={content} renderers={renderers} markdown={Markdown}>
<Experience path={location.pathname} onRedirect={(to) => navigate(to, { replace: true })} />
</ContentProvider>
)
}
// presentations/hero.tsx — one file per Template, named by its externalId, default export
import type { PresentationRenderer } from '@ebitex/content-sdk/react'
const Hero: PresentationRenderer<{ headline: string }, { theme: string }> = ({ settings, component }) => (
<section data-theme={settings.theme}>
<h1>{component.content.headline}</h1>
</section>
)
export default Hero
一个没有渲染器的模板, 一个未发布的引用, 一个需要服务器侧绑定的模板 决议——每个都使一个面板命名原因和固定,所以一个缺失的片段是可见的, 从不沉默.
来自资产库的媒体
从您的资产库中取取的图像、视频或文件作为扩展参考。 一个字段
可能允许几种,它们都有一个形状. isAssetValue 确认参考文献
其合同 externalId数字 : ebitex-image, (中文(简体) ), ebitex-video 或者说 ebitex-document),和内容的
拥有 kind 然后缩小 file 持有 :
import { isAssetValue } from '@ebitex/content-sdk'
function Media({ value }: { value: unknown }) {
if (!isAssetValue(value)) return null
const { content } = value
switch (content.kind) {
case 'image':
return <img src={content.file.url} width={content.file.width} height={content.file.height} alt={content.alt ?? content.name} />
case 'video':
// `file.url` is an HLS manifest: hand it to a player that plays HLS.
return content.file.posterUrl ? <img src={content.file.posterUrl} alt={content.name} /> : null
case 'document':
return <a href={content.file.url}>{content.name}</a>
}
}
file 已经解决了一个地方: 引渡你要求的地方, 退回去
沿着您本地地址树到默认值。 A 类 private 资产 URL 已签名并过期, 所以让它
让它去,而不是储存它.
全面指南和参考文献: 开发者.ebitex.io。 。 。 .
工作实例: ebitex 样本 仓库有两个 完整北风咖啡站点 建在这个包上 一个静态站和一个服务器 与它期望的内容模型.
了解访客的观众
个性化和受限内容取决于访客的受众。 给客户一个 audience 选项和它
询问访问者所在的观众
在记忆中签名回答, 更新它, 并发送它与每一个读取.
import { createContentClient } from '@ebitex/content-sdk'
const content = createContentClient({
apiKey: import.meta.env.VITE_DELIVERY_KEY,
audience: { apiKey: import.meta.env.VITE_AUDIENCE_DELIVERY_KEY },
})
提交表单、 在另一个标签中随附的登录链接、 暂停后返回的标签以及每个标签的刻入符
自己刷新答案,和 <Experience> 变后再读. useAudienceChange() 重新放弃自己的
访问者受众变化时的组件,以及 useSignIn() 运行电子邮件链接登录。 在服务器上,制作一个
每个请求的客户端 content.forVisitor({ visitor, consent })。在上下文中从未发送观众;内容
在那里拒绝他们.
观众交付密钥是它自己的类型(内容交付密钥不起作用). 一个有允许的原产地名单
浏览器安全, 每次请求都会检查列表 . visitor 财务报告和审定财务报表 consent 是可选的:没有,或者没有
仅由上下文决定。 观众无法回答时 onError 听说了.