首页 >web前端 >js教程 >Express.js 和 GrowthBook 的功能标志

Express.js 和 GrowthBook 的功能标志

Mary-Kate Olsen
Mary-Kate Olsen原创
2024-12-12 15:33:12764浏览

本指南逐步介绍如何向 Express.js 应用程序添加 GrowthBook 功能标志。它假设您从头开始,因此如果您已经有 Express.js 应用程序,则可以跳到步骤 2。

1. 创建 Express.js 应用程序

首先,安装 Express.js

npm install express

然后,使用简单的 hello world 路由创建一个 index.js 文件

const express = require('express')
const app = express()

app.get('/', (req, res) => {
  res.send('Hello World!')
})

// Listen on port 3000
const port = 3000
app.listen(port, () => {
  console.log(`Example app listening on port ${port}`)
})

最后,运行应用程序:

node index.js

访问 http://localhost:3000 你应该会看到一个“Hello World!”回复!

2. 创建一个GrowthBook账户

GrowthBook 可以自托管,但为了简单起见,我们将在本指南中使用 GrowthBook Cloud,对于像这样的简单项目来说,它是免费的。

如果您还没有帐户,请前往 https://app.growthbook.io 并创建一个新帐户。

登录后,创建 SDK 连接 并选择 Node.js 作为语言。这将为您生成一个唯一的客户端密钥。记下此密钥,因为我们将在下一步中使用它。

3. 将 GrowthBook JavaScript SDK 集成到 Express.js 应用程序中

创建文件 .env(如果尚不存在)并在其中添加生成的密钥:

GROWTHBOOK_API_HOST=https://cdn.growthbook.io
GROWTHBOOK_CLIENT_KEY=

现在让我们安装 GrowthBook JavaScript SDK

npm install @growthbook/growthbook

现在让我们修改index.js文件的顶部并创建一个GrowthBookClient实例:

const express = require('express')
const app = express()
const { GrowthBookClient } = require("@growthbook/growthbook")

// GrowthBookClient instance
const client = new GrowthBookClient({
  apiHost: process.env.GROWTHBOOK_API_HOST,
  clientKey: process.env.GROWTHBOOK_CLIENT_KEY
});

// Initialize it
client.init().then((status) => {
  console.log("GrowthBook initialized", status);
});

我们还可以向 index.js 添加一个中间件,为每个请求创建一个用户范围的实例。确保将其放置在路由处理程序之上:

app.use((req, res, next) => {
  // Attributes about the current user/request
  const userContext = {
    attributes: {
      // In a real app this would come from a cookie or session
      // We would also add more attributes like country, etc
      id: "123",
    }
  }

  // Make this available to all subsequent route handlers
  req.growthbook = client.createScopedInstance(userContext);
  next();
});

让我们重新启动 Node 进程,并确保您在控制台中看到“GrowthBook 已初始化”消息并且状态为成功。由于我们使用的是 .env 文件,因此我们需要修改命令来告诉 Node.js 加载它。

node --env-file=.env index.js

4. 在GrowthBook中创建一个特征

回到GrowthBook应用程序,我们可以创建一个新功能。在本教程中,我们将制作一个简单的开/关功能标志,用于确定是否以西班牙语显示消息。

Feature Flags with Express.js and GrowthBook

我们选择的键(西班牙语问候语)是我们在使用 GrowthBook SDK 时将参考的键。

我们现在可以在index.js 中编辑路由以使用此标志:

app.get('/', (req, res) => {
  let message = "Hello World!";

  if (req.growthbook.isOn("spanish-greeting")) {
    message = "Hola Mundo!";
  }

  res.send(message);
})

现在,如果您重新启动 Node 进程并在浏览器中刷新页面,您仍然会看到原来的“Hello World!”因为当我们创建该功能时,我们默认将其设置为关闭。

5. 针对特定用户

现在我们可以向该功能添加规则,以便为特定用户启用它。

在我们添加的 userContext 中,我们硬编码了一个 id“123”。我们现在可以使用此 id 在 GrowthBook 中创建规则来为该用户启用该功能。

在功能页面上,单击“添加规则”按钮并选择“强制值”作为规则类型。然后按属性添加定位并保存规则。它应该看起来像这样:

Feature Flags with Express.js and GrowthBook

规则在 GrowthBook 中以草稿状态开始。您需要发布草稿才能使其生效。

发布后,再次重启Node进程并刷新页面。您现在应该看到西班牙语的消息。 ¡Qué bueno!

尝试将 userContext 中的 id 更改为其他值,例如 456,重新启动 Node,响应现在将切换回英语。

结论和后续步骤

在本教程中,您学习了如何在 Express 应用程序中使用简单的功能标志并定位个人用户。但这仅仅触及了 GrowthBook 功能的皮毛。

以下是您可以采取的后续步骤:

  • 使用更高级的定位
  • 运行 A/B 测试

查看完整的 Node.js 文档,了解有关 GrowthBook SDK 中所有可用选项的更多信息,包括流式更新、持久缓存等。

以上是Express.js 和 GrowthBook 的功能标志的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn