# 功能标记

{% hint style="warning" %}
将自适应内容与功能标志一起使用需要向你的应用程序添加代码。

目前，GitBook helper 仅支持基于 React 的设置。
{% endhint %}

GitBook 为诸如以下流行的功能标志服务提供商提供辅助函数和集成： [**LaunchDarkly**](#launchdarkly) 并 [**Reflag**](#reflag).

这使你能够在用户阅读文档时读取他们在产品中可访问的功能标志。如果你需要为仅对特定人群开放的功能展示文档，这将非常有用。

### LaunchDarkly

LaunchDarkly 允许你通过以下方式将功能标志访问作为声明发送： [`launchdarkly-react-client-sdk`](https://launchdarkly.com/docs/sdk/client-side/react/react-web) 以及 GitBook 的 [`@gitbook/adaptive`](broken://spaces/zq8ynchcecIscc4uulgN) 包。

如果你已经在产品中使用 LaunchDarkly 功能标志，那么很可能你已经配置了这个包。

要将这些功能标志作为声明传递给 GitBook，请按以下步骤操作：

{% stepper %}
{% step %}
**安装 LaunchDarkly 集成**

要开始使用，你首先需要 [安装 LaunchDarkly 集成](https://app.gitbook.com/integrations/launchdarkly) 到你的 GitBook 站点中。
{% endstep %}

{% step %}
**设置你的项目和访问密钥**

将你的项目密钥和服务访问令牌从你的 [LaunchDarkly 设置](https://app.launchdarkly.com/settings) 添加到该集成的配置中。
{% endstep %}

{% step %}
**将 GitBook helper 安装并添加到你的应用程序中**

在设置好 LaunchDarkly 集成后，你需要在应用程序中安装 GitBook 自适应内容 helper。

```bash
npm install @gitbook/adaptive
```

{% endstep %}

{% step %}
**配置你的应用程序**

你需要将 `withLaunchDarkly` helper 与 LaunchDarkly React SDK 一起使用，以将上下文传递给 GitBook。

<pre class="language-javascript"><code class="lang-javascript">import { render } from 'react-dom';
<strong>import { withLaunchDarkly } from '@gitbook/adaptive';
</strong><strong>import { asyncWithLDProvider, useLDClient } from 'launchdarkly-react-client-sdk';
</strong>import MyApplication from './MyApplication';

function PassFeatureFlagsToGitBookSite() {
<strong>    const ldClient = useLDClient();
</strong>    React.useEffect(() => {
        if (!ldClient) {
            return;
        }
<strong>        return withLaunchDarkly(ldClient);
</strong>    }, [ldClient]);
    return null;
}
(async () => {
    const LDProvider = await asyncWithLDProvider({
        clientSideID: 'client-side-id-123abc',
        context: {
            kind: 'user',
            key: 'user-key-123abc',
            name: 'Sandy Smith',
            email: 'sandy@example.com'
        },
        options: { /* ... */ }
    });
    render(
        &#x3C;LDProvider>
            &#x3C;PassFeatureFlagsToGitBookSite />
            &#x3C;MyApplication />
        &#x3C;/LDProvider>,
        document.getElementById('reactDiv'),
    );
})();
</code></pre>

{% endstep %}

{% step %}
**检查你的访客 schema**

一项 [访客 schema](/docs/documentation/zh/zhan-dian-fang-wen/adaptive-content/enabling-adaptive-content.md#set-your-visitor-schema) 是必需的，这样你的声明才能在已发布站点中被读取。安装并配置 LaunchDarkly 集成应会自动为你设置访客 schema。
{% endstep %}

{% step %}
**个性化你的内容**

设置好访客 schema 后，你就可以使用用户可访问的功能标志，为访问你站点的用户定制文档体验。

LaunchDarkly 中可用的任何功能标志值都会作为访客 schema 的一部分，显示在 `visitor.claims.unsigned.launchdarkly` 对象下。阅读更多关于未签名声明的信息 [这里](/docs/documentation/zh/zhan-dian-fang-wen/adaptive-content/enabling-adaptive-content.md#set-an-unsigned-claim).

进入 [调整你的内容](/docs/documentation/zh/zhan-dian-fang-wen/adaptive-content/adapting-your-content.md) 以了解更多关于为用户个性化文档的信息。
{% endstep %}
{% endstepper %}

### Reflag

Reflag 允许你通过以下方式将功能标志访问作为声明发送： [`@reflag/react-sdk`](https://www.npmjs.com/package/@reflag/react-sdk) 以及 GitBook 的 [`@gitbook/adaptive`](https://github.com/GitbookIO/integrations/tree/main/packages/adaptive) 包。

如果你已经在产品中使用 Reflag 功能标志，那么很可能你已经配置了这个包。

要将这些功能标志作为声明传递给 GitBook，请按以下步骤操作：

{% stepper %}
{% step %}
**安装 Reflag 集成**

要开始使用，你首先需要 [安装 Reflag 集成](https://app.gitbook.com/integrations/bucket) 到你的 GitBook 站点中。
{% endstep %}

{% step %}
**设置你的密钥**

将你的密钥从你的 [Reflag 设置](https://app.reflag.com/envs/current/settings/app-environments) 添加到该集成的配置中。
{% endstep %}

{% step %}
**将 GitBook helper 安装到你的应用程序中**

在设置好 Reflag 集成后，你需要在应用程序中安装 GitBook 自适应内容 helper。

```bash
npm install @gitbook/adaptive
```

{% endstep %}

{% step %}
**配置你的应用程序**

你需要将 `withReflag` helper 与 Reflag React SDK 一起使用，以将上下文传递给 GitBook。

<pre class="language-javascript"><code class="lang-javascript"><strong>import { withReflag } from '@gitbook/adaptive';
</strong><strong>import { ReflagProvider, useClient } from '@reflag/react-sdk';
</strong>import MyApplication from './MyApplication';

function PassFeatureFlagsToGitBookSite() {
<strong>    const client = useClient();
</strong>    React.useEffect(() => {
        if (!client) {
            return;
        }
<strong>        return withReflag(client);
</strong>    }, [client]);
    return null;
}
export function Application() {
    const currentUser = useLoggedInUser();
    const appConfig = useAppConfig();
    return (
        &#x3C;ReflagProvider
            publishableKey={appConfig.reflagCom.publishableKey}
            user={{
                id: currentUser.uid,
                email: currentUser.email ?? undefined,
                name: currentUser.displayName ?? '',
            }}
            company={{
                id: currentUser.company.id,
            }}
        >
            &#x3C;PassFeatureFlagsToGitBookSite />
            &#x3C;MyApplication />
        &#x3C;/ReflagProvider>
    );
}
</code></pre>

{% endstep %}

{% step %}
**检查你的访客 schema**

一项 [访客 schema](/docs/documentation/zh/zhan-dian-fang-wen/adaptive-content/enabling-adaptive-content.md#set-your-visitor-schema) 是必需的，这样你的声明才能在已发布站点中被读取。安装并配置 Reflag 集成应会自动为你设置访客 schema。
{% endstep %}

{% step %}
**个性化你的内容**

设置好访客 schema 后，你就可以使用用户可访问的功能标志，为访问你站点的用户定制文档体验。

Reflag 中可用的任何功能标志值都会作为访客 schema 的一部分，显示在 `visitor.claims.unsigned.reflag` 对象下。阅读更多关于未签名声明的信息 [这里](/docs/documentation/zh/zhan-dian-fang-wen/adaptive-content/enabling-adaptive-content.md#set-an-unsigned-claim).

进入 [调整你的内容](/docs/documentation/zh/zhan-dian-fang-wen/adaptive-content/adapting-your-content.md) 以了解更多关于为用户个性化文档的信息。
{% endstep %}
{% endstepper %}

{% hint style="info" %}
功能标志值是在客户端计算的，因此避免使用此方法传递敏感或对安全至关重要的数据。
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://gitbook.com/docs/documentation/zh/zhan-dian-fang-wen/adaptive-content/enabling-adaptive-content/feature-flags.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
