Embetty 开源项目使用教程-CSDN博客

本文链接：https://blog.csdn.net/gitblog_00015/article/details/141986759

Embetty 开源项目使用教程

embetty🐙 Embetty displays remote content like tweets or YouTube videos without compromising your privacy.项目地址:https://gitcode.com/gh_mirrors/em/embetty

1. 项目介绍

Embetty 是一个开源项目，旨在帮助用户在不损害隐私的情况下展示远程内容，如推文或YouTube视频。Embetty 通过代理和提供数据的方式，确保用户在浏览这些内容时不会泄露个人信息。该项目由 heiseonline 维护，采用 MIT 许可证。

2. 项目快速启动

2.1 设置 Embetty 服务器

首先，你需要在你的基础设施上运行 Embetty 服务器组件。

2.2 在 HTML 文档中包含 Embetty 库

在你的 HTML 文档中，使用以下代码引入 Embetty 库：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta data-embetty-server="/path/to/embetty-server" />
    <script async src="embetty.js"></script>
</head>
<body>
    <embetty-tweet status="1166685910030790662"></embetty-tweet>
</body>
</html>

2.3 配置 Embetty 服务器 URL

使用 <meta data-embetty-server> 标签配置 Embetty 服务器的 URL：

<head>
    <meta data-embetty-server="/path/to/embetty-server" />
</head>

2.4 引入 Embetty.js

有三种方式引入 Embetty.js：

从发布页面下载 Embetty 归档文件。
在你的站点上提供 Embetty.js。
在 npm 项目中使用 Embetty：

yarn add @embetty/component
# 或
npm install @embetty/component --save

然后在你的主脚本中导入 Embetty：

import '@embetty/component';

2.5 克隆仓库并构建

克隆 Embetty 仓库并构建 /dist/embetty.js：

git clone https://github.com/heiseonline/embetty
cd embetty
yarn
yarn build

3. 应用案例和最佳实践

3.1 嵌入推文

使用 status 属性嵌入推文，并使用 include-thread 属性包含推文线程：

<embetty-tweet status="950371792874557440" include-thread></embetty-tweet>

3.2 嵌入视频

Embetty 支持多种视频平台的嵌入，具体使用方法请参考官方文档。

4. 典型生态项目

Embetty 作为一个专注于隐私保护的远程内容展示工具，可以与其他前端框架和工具结合使用，如 React、Vue.js 等。通过结合这些工具，可以更灵活地集成 Embetty 到现有的项目中，实现更丰富的功能和更好的用户体验。

通过以上步骤，你可以快速上手并使用 Embetty 项目，展示远程内容而不损害用户隐私。

embetty🐙 Embetty displays remote content like tweets or YouTube videos without compromising your privacy.项目地址:https://gitcode.com/gh_mirrors/em/embetty