unleash proxy client js
v3.6.1
JavaScript 代理客戶端是一個用 JavaScript 編寫的小型 Unleash 用戶端，沒有任何外部相依性（瀏覽器 API 除外）。此用戶端在localStorage中儲存與目前使用者相關的切換，並在背景與 Unleash（Unleash 前端 API或Unleash 代理程式）同步。由於切換儲存在使用者的瀏覽器中，因此客戶端可以在使用者下次造訪同一網頁時使用它們來引導自己。
該客戶端期望fetch可用。如果您需要支援舊版瀏覽器，您可能應該使用 fetch polyfill。
該套件不綁定任何框架，但可以與最受歡迎的框架一起使用，範例：
npm install unleash - proxy - client提示：作為客戶端 SDK，此 SDK 要求您連線到 Unleash 代理程式或 Unleash 前端 API。有關詳細信息，請參閱連接選項部分。
根據您的需求設定客戶端。以下範例僅提供必需的選項。有關完整列表，請參閱有關可用選項的部分。
import { UnleashClient } from 'unleash-proxy-client' ;
const unleash = new UnleashClient ( {
url : 'https://<your-unleash-instance>/api/frontend' ,
clientKey : '<your-client-side-token>' ,
appName : 'my-webapp' ,
} ) ;
// Start the background polling
unleash . start ( ) ; 若要將此 SDK 連接到 Unleash 實例的前端 API，請使用 Unleash 實例的前端 API ( <unleash-url>/api/frontend ) 的 URL 作為url參數。對於clientKey參數，請使用從 Unleash 實例產生的FRONTEND令牌。請參閱如何建立 API 令牌指南以了解必要的步驟。
若要將此 SDK 連線到 Unleash 代理，請使用代理程式的 URL 和代理用戶端金鑰。 Unleash 代理文件的設定部分包含有關如何為代理程式設定用戶端金鑰的詳細資訊。
在開始使用客戶端之前，您應該等待客戶端的ready或initialized事件。在準備就緒之前，客戶端可能不會報告您的功能的正確狀態。
unleash . on ( 'ready' , ( ) => {
if ( unleash . isEnabled ( 'proxy.demo' ) ) {
console . log ( 'proxy.demo is enabled' ) ;
} else {
console . log ( 'proxy.demo is disabled' ) ;
}
} ) ;可用事件部分描述了事件之間的差異。
一旦客戶端準備就緒，您就可以開始檢查應用程式中的功能。使用isEnabled方法檢查您想要的任何功能的狀態：
unleash . isEnabled ( 'proxy.demo' ) ;您可以使用getVariant方法取得已啟用功能的變體，該功能具有變數。如果該功能已停用或沒有變體，那麼您將取回已停用的變體
const variant = unleash . getVariant ( 'proxy.demo' ) ;
if ( variant . name === 'blue' ) {
// something with variant blue...
} Unleash 上下文用於根據目前使用者的屬性評估功能。若要更新並設定此 SDK 中的 Unleash 上下文，請使用updateContext 、 setContextField和removeContextField方法。
您在應用程式中設定的上下文將作為功能評估的查詢參數傳遞到 Unleash 代理或前端 API。
updateContext方法將使用您傳入的資料來取代 Unleash 上下文的整個（可變部分）。
setContextField方法僅作用於您選擇的屬性。它不會影響 Unleash 上下文的任何其他屬性。
unleash . updateContext ( { userId : '1233' } ) ;
unleash . setContextField ( 'userId' , '4141' ) ; removeContextField方法僅作用於您選擇的屬性。它不會影響 Unleash 上下文的任何其他屬性。
unleash . updateContext ( { userId : '1233' , sessionId : 'sessionNotAffected' } ) ;
unleash . removeContextField ( 'userId' ) ;Unleash SDK 採用以下選項：
| 選項 | 必需的 | 預設 | 描述 |
|---|---|---|---|
| 網址 | 是的 | 不適用 | 要連接的 Unleash 代理 URL。例如：https: https://examples.com/proxy |
| 客戶端密鑰 | 是的 | 不適用 | 要使用的 Unleash 代理程式密鑰 |
| 應用程式名稱 | 是的 | 不適用 | 使用此 SDK 的應用程式的名稱。將用作發送到 Unleash Proxy 的指標的一部分。也將成為 Unleash Context 的一部分。 |
| 情境 | 不 | {} | 初始釋放上下文。這將用作所有功能切換評估的初始上下文。 appName和environment選項將自動填入您為這些選項傳遞的值。 |
| 刷新間隔 | 不 | 30 | SDK 應檢查更新的切換配置的頻率（以秒為單位）。如果設定為 0 將停用檢查更新 |
| 停用重新整理 | 不 | false | 如果設定為 true，用戶端將不會檢查更新的切換配置 |
| 指標間隔 | 不 | 60 | SDK 應將使用指標傳回 Unleash Proxy 的頻率（以秒為單位）。它將在初始指標報告之後啟動，該報告是在配置的metricsIntervalInitial之後發送的 |
| 指標間隔初始值 | 不 | 2 | SDK 應等待第一個指標報告回傳 Unleash API 的時間。如果您想要停用初始指標調用，可以將其設為 0。 |
| 禁用指標 | 不 | false | 如果您想停用使用指標，請將此選項設為true |
| 儲存提供者 | 不 | 瀏覽器中的LocalStorageProvider ，否則為InMemoryStorageProvider | 允許您注入自訂 storeProvider |
| 拿來 | 不 | window.fetch或全域fetch | 允許您覆蓋要使用的獲取實作。在可以注入node-fetch的 Node.js 環境中很有用 |
| 建立AbortController | 不 | () => new AbortController() | 允許您覆蓋預設的AbortController建立。用於取消上下文過時的請求。如果您不想處理它，請將其設為() => null 。 |
| 引導程式 | 不 | [] | 允許您引導快取的功能切換配置。 |
| 引導覆蓋 | 不 | true | 引導程式是否應該自動覆蓋本地儲存中的快取資料。僅當 bootstrap 不是空數組時才會使用。 |
| 標頭名稱 | 不 | Authorization | SDK 應使用哪個標頭來透過 Unleash / Unleash 代理進行授權。標頭將被賦予clientKey作為其值。 |
| 自訂標題 | 不 | {} | 向 Unleash 代理程式發出 HTTP 請求時要使用的其他標頭。如果與預設標頭發生名稱衝突，則將使用customHeaders值（如果它不是null或undefined 。 null或undefined customHeaders值將被忽略。 |
| 印象數據全部 | 不 | false | 允許您為所有getToggle和getVariant呼叫觸發「impression」事件。這對於前端 SDK 不可見的「停用」功能切換特別有用。 |
| 環境 | 不 | default | 設定 Unleash 上下文的environment選項。這不會影響 SDK 的 Unleash 環境。 |
| 使用POST請求 | 不 | false | 將用戶端設定為在請求啟用的功能時使用 POST 請求而不是 GET。當敏感資訊（如使用者電子郵件，用作使用者 ID 時）在上下文中傳遞時，這非常有用，以避免在 URL 中洩漏該資訊。注意：Unleash 內建的前端 API 不支援 Post 請求。 |
| 實驗性的 | 不 | {} | 啟用可選實驗。 togglesStorageTTL ：儲存中的切換被認為有效且不應在啟動時獲取的時間（生存時間）（以秒為單位）。如果設定為 0 將停用過期檢查並被視為始終過期。 |
客戶端也是事件發射器。這意味著您的程式碼可以訂閱來自客戶端的更新。這是在切換狀態更新時更新單頁應用程式的巧妙方法。
unleash . on ( 'update' , ( ) => {
const myToggle = unleash . isEnabled ( 'proxy.demo' ) ;
//do something useful
} ) ; 附言！請記住，您應該始終在呼叫
unleash.start()之前註冊事件偵聽器。如果您在啟動 SDK 後註冊它們，您將面臨遺失重要事件的風險。
您可以透過「上下文」提供自訂會話 ID。如果您不提供 sessionId，此 SDK 將建立一個隨機會話 ID，該 ID 也會儲存在提供的儲存空間（本機儲存）中。透過始終保持一致的 sessionId 可用，可確保在評估功能切換時，即使是「匿名」使用者也能獲得一致的體驗，並結合逐步（基於百分比）的推出。
您可以透過呼叫stop方法來停止 Unleash 用戶端。一旦客戶端停止，它將不再檢查更新或向伺服器發送指標。
已停止的客戶端可以重新啟動。
unleash . stop ( )該 SDK 可以與 React Native 儲存 @react-native-async-storage/async-storage 或 react-native-shared-preferences 以及更多其他功能一起使用，以在本地備份功能切換。這對於用戶下次返回應用程式時引導 SDK 非常有用。
您可以提供自己的儲存實作。
範例：
import SharedPreferences from 'react-native-shared-preferences' ;
import { UnleashClient } from 'unleash-proxy-client' ;
const unleash = new UnleashClient ( {
url : 'https://eu.unleash-hosted.com/hosted/proxy' ,
clientKey : 'your-proxy-key' ,
appName : 'my-webapp' ,
storageProvider : {
save : ( name : string , data : any ) => SharedPreferences . setItem ( name , data ) ,
get : ( name : string ) => SharedPreferences . getItem ( name , ( val ) => val )
} ,
} ) ; import AsyncStorage from '@react-native-async-storage/async-storage' ;
import { UnleashClient } from 'unleash-proxy-client' ;
const PREFIX = 'unleash:repository' ;
const unleash = new UnleashClient ( {
url : 'https://eu.unleash-hosted.com/hosted/proxy' ,
clientKey : 'your-proxy-key' ,
appName : 'my-webapp' ,
storageProvider : {
save : ( name : string , data : any ) => {
const repo = JSON . stringify ( data ) ;
const key = ` ${ PREFIX } : ${ name } ` ;
return AsyncStorage . setItem ( key , repo ) ;
} ,
get : ( name : string ) => {
const key = ` ${ PREFIX } : ${ name } ` ;
const data = await AsyncStorage . getItem ( key ) ;
return data ? JSON . parse ( data ) : undefined ;
}
} ,
} ) ; 該 SDK 也可以在 Node.js 應用程式中使用（從 v1.4.0 開始）。請注意，您需要提供有效的「獲取」實作。僅 ECMAScript 模組從此套件中匯出。
import fetch from 'node-fetch' ;
import { UnleashClient , InMemoryStorageProvider } from 'unleash-proxy-client' ;
const unleash = new UnleashClient ( {
url : 'https://app.unleash-hosted.com/demo/proxy' ,
clientKey : 'proxy-123' ,
appName : 'nodejs-proxy' ,
storageProvider : new InMemoryStorageProvider ( ) ,
fetch ,
} ) ;
await unleash . start ( ) ;
const isEnabled = unleash . isEnabled ( 'proxy.demo' ) ;
console . log ( isEnabled ) ;索引.mjs
< html >
< head >
< script src =" https://unpkg.com/unleash-proxy-client@latest/build/main.min.js " type =" text/javascript " > </ script >
< script type =" text/javascript " >
var config = { url : 'https://app.unleash-hosted.com/demo/proxy' , clientKey : 'proxy-123' , appName : 'web' } ;
var client = new unleash . UnleashClient ( config ) ;
client . updateContext ( { userId : '1233' } )
client . on ( 'update' , ( ) => {
console . log ( client . isEnabled ( 'proxy.demo' ) ) ;
} ) ;
client . start ( ) ;
</ script >
</ head >
</ html > 現在，當您不想進行 API 呼叫時，可以使用您自己的功能切換配置來引導 SDK。
如果您需要在初始化 SDK 後立即使切換處於某種狀態，這也很有用。
建立新的UnleashClient時新增bootstrap屬性。
還有一個bootstrapOverride屬性，預設為true 。
import { UnleashClient } from 'unleash-proxy-client' ;
const unleash = new UnleashClient ( {
url : 'https://app.unleash-hosted.com/demo/proxy' ,
clientKey : 'proxy-123' ,
appName : 'nodejs-proxy' ,
bootstrap : [ {
"enabled" : true ,
"name" : "demoApp.step4" ,
"variant" : {
"enabled" : true ,
"name" : "blue" ,
"feature_enabled" : true ,
}
} ] ,
bootstrapOverride : false
} ) ;筆記：bootstrapOverride為true （預設），則任何本機快取的資料都會被指定的引導程式覆寫。
如果bootstrapOverride為false則不會覆蓋任何本地快取數據，除非本地快取為空。
您可以透過將refreshInterval和/或metricsInterval選項設為0來選擇退出Unleash功能標誌自動刷新機制和指標更新。在這種情況下，您有責任呼叫updateToggles和/或sendMetrics方法。此方法在不支援setInterval API 的環境中非常有用，例如服務工作執行緒。
