Launch Darkly 有一个示例(https://github.com/launchdarkly/react-client-sdk/blob/main/examples/async-provider/src/client/index.js),说明如何将 asyncWithLDProvider 与 React 项目一起使用(如下)但我不知道如何将其与我的下一个应用程序集成。
例子
import { asyncWithLDProvider } from 'launchdarkly-react-client-sdk';
(async () => {
const LDProvider = await asyncWithLDProvider({
clientSideID: 'client-side-id-123abc',
user: {
"key": "user-key-123abc",
"name": "Sandy Smith",
"email": "sandy@example.com"
},
options: { /* ... */ }
});
render(
<LDProvider>
<YourApp />
</LDProvider>,
document.getElementById('reactDiv'),
);
})();
Run Code Online (Sandbox Code Playgroud)
已尝试在 _app.tsx 文件中创建一个提供程序并包装整个应用程序,但由于asyncWithLDProvider是异步的并且需要await关键字,因此这很棘手。
像这样的东西
const App = ({ Component }) = {
// but how to get this async function to work with the …Run Code Online (Sandbox Code Playgroud) 我将 App.js 文件包装在 withLDProvider 组件中,我想知道如何从 App 函数内部设置用户信息。
比方说,例如,我获取了在应用程序功能内的 Dexie 中缓存的用户名,如何将该用户信息传递到导出应用程序功能时设置用户详细信息的位置。
我已经可以获得所有用户信息,只是不确定应该如何传递用户信息。我觉得我在这里采取了错误的方法,但不太确定具体如何去做。
import React from 'react';
import './App.css';
import { withLDProvider } from 'launchdarkly-react-client-sdk';
import HelloWorld from './HelloWorld';
const App = () => {
const [user, setUser] = useState({});
// Let's say for example that I asynchronously get my
// user information here and use hooks to set the user
return (
<div className="App">
<header className="App-header">
{
user ? <HelloWorld />
: <div>A login screen would go here</div>
}
</header>
</div> …Run Code Online (Sandbox Code Playgroud) 我创建了一个服务,它的模块如下所示:
launchdarkly.module.ts
@Module({
providers: [LaunchdarklyService],
exports: [LaunchdarklyService],
imports: [ConfigService],
})
export class LaunchdarklyModule {}
Run Code Online (Sandbox Code Playgroud)
(此服务/模块是让应用程序使用 LaunchDarkly 功能标记)
如果您愿意,我很乐意展示服务实现,但为了缩短这个问题,我跳过了它。重要的一点是该服务导入ConfigService(它用于获取 LaunchDarkly SDK 密钥)。
但是我该如何测试Launchdarkly服务呢?它从中读取一个键,ConfigService所以我想编写ConfigService具有各种值的测试,但是经过数小时的尝试,我无法弄清楚如何ConfigService在测试中进行配置。
这是测试:
launchdarkly.service.spec.ts
describe('LaunchdarklyService', () => {
let service: LaunchdarklyService;
beforeEach(async () => {
const module: TestingModule = await Test.createTestingModule({
providers: [LaunchdarklyService],
imports: [ConfigModule],
}).compile();
service = module.get<LaunchdarklyService>(LaunchdarklyService);
});
it("should not create a client if there's no key", async () => {
// somehow I need ConfigService to have …Run Code Online (Sandbox Code Playgroud) 我正在使用 LaunchDarkly 进行功能标志管理,但我不知道从哪里获取当前用户的密钥。以下是其 React SDK 的 LD 文档中的示例:
import { withLDProvider } from 'launchdarkly-react-client-sdk';
export default withLDProvider({
clientSideID: 'your-client-side-id',
user: {
"key": "aa0ceb",
"name": "Grace Hopper",
"email": "gracehopper@example.com"
},
options: { /* ... */ }
})(YourApp);
Run Code Online (Sandbox Code Playgroud)
我如何得到这个key?键 和 和有什么不一样clientSideID?
我正在设置LaunchDarkly来控制我的第一个功能标志,它在服务器和客户端的工作正常.现在我正在尝试LaunchDarkly Bootstrap方法(从下面给出的链接)并尝试下面我的代码,但它不接受双括号,我不知道如何通过使用bootstrap方法获得标志值,所以我做错了在我的代码?有谁可以帮我举个例子?
链接,
https://docs.launchdarkly.com/docs/js-sdk-reference#section-bootstrapping
Run Code Online (Sandbox Code Playgroud)
使用Bootstrap选项初始化客户端,如下所示,
client = LDClient.initialize(sdkKey, userContext.user, options = {
bootstrap: {
{{ ldclient.all_flags(userContext.user) }}
}
});
Run Code Online (Sandbox Code Playgroud)
我的函数获取标志值,
isFeatureEnabled: function (featureFlag, properties) {
console.log("Before Variation");
//we shall update the custom properties into user context.
if (properties) {
for (var k in properties) {
userContext.user.custom[k] = properties[k];
}
}
//later make the identity call to update the user details.
client.identify(userContext.user, null, function () { /*rules updated*/
console.log("New user's flags available");
//validate the feature flag
var showFeature = client.variation(featureFlag);
if …Run Code Online (Sandbox Code Playgroud) 我最近开始使用黑暗启动(LD)。我正在探索 LD 如何更新其功能标志。
正如这里提到的,有两种方法。
我只是在想在什么情况下哪种实现会更好。经过一番研究streaming vs polling,发现Streaming有以下优点polling。
我很确定上述所有优势都是有代价的。所以,
launchdarkly ×6
javascript ×3
reactjs ×3
asynchronous ×1
nestjs ×1
next.js ×1
polling ×1
streaming ×1
typescript ×1