Feature-Flags erstellen

Mit Feature-Flags können Sie Funktionen für eine ausgewählte Nutzergruppe remote aktivieren oder deaktivieren. Erstellen Sie ein neues Feature-Flag im Braze-Dashboard. Geben Sie einen Namen und eine ID, eine Zielgruppe und einen Prozentsatz der Nutzer:innen an, für die dieses Feature aktiviert werden soll. Dann können Sie mit der gleichen ID im Code Ihrer App oder Website bestimmte Teile Ihrer Geschäftslogik bedingt ausführen. Mehr über Feature-Flags und wie Sie sie in Braze verwenden können, erfahren Sie unter Über Feature-Flags.

Voraussetzungen

SDK-Version

Um Feature-Flags zu nutzen, stellen Sie sicher, dass Ihre SDKs mindestens auf diese Mindestversionen aktualisiert sind:

Braze-Berechtigungen

Um Feature-Flags im Dashboard zu verwalten, müssen Sie entweder Administrator:in sein oder über die folgenden Berechtigungen verfügen:

Ein Feature-Flag erstellen

1. Schritt: Ein neues Feature-Flag erstellen

Gehen Sie zu Messaging > Feature-Flags und wählen Sie dann Feature-Flag erstellen.

2. Schritt: Details ausfüllen

Geben Sie unter Feature-Flag-Details einen Namen, eine ID und eine Beschreibung für Ihr Feature-Flag ein.

2a. Schritt: Angepasste Eigenschaften erstellen

Unter Eigenschaften können Sie optional angepasste Eigenschaften erstellen, auf die Ihre App über das Braze SDK zugreifen kann, wenn Ihr Feature aktiviert ist. Sie können jeder Variablen einen String-, Booleschen-, Bild-, Zeitstempel-, JSON- oder Zahlenwert zuweisen sowie einen Standardwert festlegen.

• beispiel

Im folgenden Beispiel zeigt das Feature-Flag ein „Nicht auf Lager“-Banner für einen E-Commerce-Shop unter Verwendung der aufgelisteten angepassten Eigenschaften:

Eigenschaftsname	Typ	Wert
banner_height	number	75
banner_color	string	blue
banner_text	string	Widgets are out of stock until July 1.
dismissible	boolean	false
homepage_icon	image	http://s3.amazonaws.com/[bucket_name]/
account_start	timestamp	2011-01-01T12:00:00Z
footer_settings	JSON	{ "colors": [ "red", "blue", "green" ], "placement": 123 }

Tipp

Es gibt keine Begrenzung für die Anzahl der Eigenschaften, die Sie hinzufügen können. Die Eigenschaften eines Feature-Flags sind jedoch auf insgesamt 10.000 Zeichen begrenzt.

4. Schritt: Segmente für die Zielgruppe auswählen

Bevor Sie ein Feature-Flag ausrollen, müssen Sie ein Segment von Nutzer:innen auswählen, das Sie ansprechen möchten. Wählen Sie Regel hinzufügen für Ihr neu erstelltes Flag und verwenden Sie dann die Filtergruppen- und Segment-Dropdown-Menüs, um Nutzer:innen aus Ihrer Zielgruppe herauszufiltern. Fügen Sie mehrere Filter hinzu, um Ihre Zielgruppe weiter einzugrenzen.

5. Schritt: Den Rollout-Traffic festlegen

Standardmäßig sind Feature-Flags immer inaktiv, sodass Sie das Veröffentlichungsdatum Ihres Features von der gesamten Nutzeraktivierung trennen können. Um mit dem Rollout zu beginnen, verwenden Sie den Abschnitt Rollout Traffic und geben Sie einen Prozentsatz in das Textfeld ein. Dieser bestimmt den Prozentsatz zufälliger Nutzer:innen in Ihrem ausgewählten Segment, die dieses neue Feature erhalten.

Wichtig

Setzen Sie Ihren Rollout-Traffic nicht höher als 0 %, bis Sie bereit sind, Ihr neues Feature live zu schalten. Wenn Sie Ihr Feature-Flag erstmals im Dashboard definieren, lassen Sie diese Einstellung bei 0 %.

Wichtig

Um ein Flag mit nur einer Regel oder für eine einzelne Zielgruppe auszurollen, fügen Sie Ihre erste Regel mit Segmentierungskriterien und ausgewählten Rollout-Prozentsätzen hinzu. Stellen Sie abschließend sicher, dass die Regel Alle anderen deaktiviert ist, und speichern Sie Ihr Flag.

Feature-Flag-Rollouts mit mehreren Regeln

Verwenden Sie Feature-Flag-Rollouts mit mehreren Regeln, um eine Abfolge von Regeln für die Bewertung von Nutzer:innen zu definieren. So ermöglichen Sie eine präzise Segmentierung und kontrollierte Feature-Releases. Diese Methode eignet sich ideal für die Bereitstellung desselben Features an unterschiedliche Zielgruppen.

Auswertungsreihenfolge

Feature-Flag-Regeln werden von oben nach unten in der Reihenfolge ausgewertet, in der sie aufgelistet sind. Nutzer:innen qualifizieren sich für die erste Regel, die sie erfüllen. Wenn Nutzer:innen keine Regel erfüllen, wird ihre Berechtigung durch die Standardregel „Alle anderen“ bestimmt.

Nutzerqualifizierung

• Wenn Nutzer:innen die Kriterien der ersten Regel erfüllen, sind sie sofort berechtigt, das Feature-Flag zu erhalten.
• Wenn Nutzer:innen sich nicht für die erste Regel qualifizieren, werden sie anhand der zweiten Regel bewertet, und so weiter.

Die sequenzielle Auswertung wird fortgesetzt, bis sich Nutzer:innen für eine Regel qualifizieren oder die Regel „Alle anderen“ am Ende der Liste erreichen.

Regel „Alle anderen“

Die Regel „Alle anderen“ dient als Standard. Wenn sich Nutzer:innen für keine der vorhergehenden Regeln qualifizieren, wird ihre Berechtigung für das Feature-Flag durch die Umschalteinstellung der Regel „Alle anderen“ bestimmt. Wenn die Regel „Alle anderen“ beispielsweise im Standardzustand auf „Aus“ gesetzt ist, erhalten Nutzer:innen, die die Kriterien keiner anderen Regel erfüllen, das Feature-Flag beim Start ihrer Sitzung nicht.

Regeln neu anordnen

Standardmäßig sind Regeln in der Reihenfolge angeordnet, in der sie erstellt wurden. Sie können diese Regeln jedoch per Drag-and-Drop im Dashboard neu anordnen.

Anwendungsfälle für Feature-Flags mit mehreren Regeln

Schrittweiser Rollout einer Checkout-Seite

Nehmen wir an, Sie arbeiten für eine E-Commerce-Marke und haben eine neue Checkout-Seite, die Sie in verschiedenen Regionen ausrollen möchten, um die Stabilität sicherzustellen. Mit Feature-Flags mit mehreren Regeln können Sie Folgendes festlegen:

• Regel 1: Ihr US-Segment ist auf 100 % gesetzt.
• Regel 2: Ihr Segment ist auf 50 % Ihrer brasilianischen Nutzer:innen gesetzt, sodass nicht alle den neuen Flow gleichzeitig erhalten.
• Regel 3 (Alle anderen): Für alle anderen Nutzer:innen schalten Sie Ihre Regel „Alle anderen“ ein und setzen sie auf 15 %, sodass ein Teil aller Nutzer:innen den neuen Checkout-Flow nutzen kann.

Interne Tester:innen zuerst erreichen

Nehmen wir an, Sie sind Produktmanager:in und möchten sicherstellen, dass Ihre internen Tester:innen das Feature-Flag immer erhalten, wenn Sie ein neues Produkt veröffentlichen. Sie können Ihr Segment für interne Tester:innen zu Ihrer ersten Regel hinzufügen und es auf 100 % setzen, sodass Ihre internen Tester:innen bei jedem Feature-Rollout berechtigt sind.

Verwendung des Felds „aktiviert“ für Feature-Flags

Nachdem Sie Ihr Feature-Flag definiert haben, konfigurieren Sie Ihre App oder Website so, dass überprüft wird, ob es für eine bestimmte Nutzer:in aktiviert ist. Ist es aktiviert, legen Sie eine Aktion fest oder referenzieren die Variablen-Eigenschaften des Feature-Flags je nach Ihrem Anwendungsfall. Das Braze SDK stellt Getter-Methoden bereit, um den Status des Feature-Flags und seine Eigenschaften in Ihre App einzubinden.

Feature-Flags werden beim Sitzungsstart automatisch aktualisiert, sodass Sie jeweils die aktuellste Version Ihres Features anzeigen können. Das SDK speichert diese Werte im Cache, sodass sie auch offline verwendet werden können.

Hinweis

Vergewissern Sie sich, dass Sie Feature-Flag-Impressionen protokollieren.

Nehmen wir an, Sie möchten einen neuen Typ von Nutzerprofil für Ihre App einführen. Sie können die ID als expanded_user_profile festlegen. Dann würden Sie Ihre App prüfen lassen, ob sie dieses neue Nutzerprofil einer bestimmten Nutzer:in anzeigen soll. Zum Beispiel:

• web
• swift
• android
• react native
• unity
• cordova
• flutter
• roku

1
2
3
4
5
6

const featureFlag = braze.getFeatureFlag("expanded_user_profile");
if (featureFlag?.enabled) {
  console.log(`expanded_user_profile is enabled`);
} else {
  console.log(`expanded_user_profile is not enabled`);
}

1
2
3
4
5
6

let featureFlag = braze.featureFlags.featureFlag(id: "expanded_user_profile")
if featureFlag?.enabled == true {
  print("expanded_user_profile is enabled")
} else {
  print("expanded_user_profile is not enabled")
}

1
2
3
4
5
6

FeatureFlag featureFlag = braze.getFeatureFlag("expanded_user_profile");
if (featureFlag != null && featureFlag.getEnabled()) {
  Log.i(TAG, "expanded_user_profile is enabled");
} else {
  Log.i(TAG, "expanded_user_profile is not enabled");
}

1
2
3
4
5
6

val featureFlag = braze.getFeatureFlag("expanded_user_profile")
if (featureFlag?.enabled == true) {
  Log.i(TAG, "expanded_user_profile is enabled.")
} else {
  Log.i(TAG, "expanded_user_profile is not enabled.")
}

1
2
3
4
5
6

const featureFlag = await Braze.getFeatureFlag("expanded_user_profile");
if (featureFlag?.enabled) {
  console.log(`expanded_user_profile is enabled`);
} else {
  console.log(`expanded_user_profile is not enabled`);
}

1
2
3
4
5
6

var featureFlag = Appboy.AppboyBinding.GetFeatureFlag("expanded_user_profile");
if (featureFlag != null && featureFlag.Enabled) {
  Console.WriteLine("expanded_user_profile is enabled");
} else {
  Console.WriteLine("expanded_user_profile is not enabled");
}

1
2
3
4
5
6

const featureFlag = await BrazePlugin.getFeatureFlag("expanded_user_profile");
if (featureFlag?.enabled) {
  console.log(`expanded_user_profile is enabled`);
} else {
  console.log(`expanded_user_profile is not enabled`);
}

1
2
3
4
5
6

BrazeFeatureFlag? featureFlag = await braze.getFeatureFlagByID("expanded_user_profile");
if (featureFlag?.enabled == true) {
  print("expanded_user_profile is enabled");
} else {
  print("expanded_user_profile is not enabled");
}

1
2
3
4
5
6

featureFlag = m.braze.getFeatureFlag("expanded_user_profile")
if featureFlag <> invalid and featureFlag.enabled
  print "expanded_user_profile is enabled"
else
  print "expanded_user_profile is not enabled"
end if

Protokollierung einer Feature-Flag-Impression

Tracken Sie eine Feature-Flag-Impression, wenn eine Nutzer:in die Gelegenheit hatte, mit dem neuen Feature zu interagieren, oder wenn sie bei deaktiviertem Feature hätte interagieren können (im Fall einer Kontrollgruppe in einem A/B-Test). Feature-Flag-Impressionen werden nur einmal pro Sitzung protokolliert.

Normalerweise können Sie diese Codezeile direkt unterhalb der Stelle einfügen, an der Sie das Feature-Flag in Ihrer App referenzieren:

• web
• swift
• android
• react native
• unity
• cordova
• flutter
• roku

1

braze.logFeatureFlagImpression("expanded_user_profile");

1

braze.featureFlags.logFeatureFlagImpression(id: "expanded_user_profile")

1

braze.logFeatureFlagImpression("expanded_user_profile");

1

braze.logFeatureFlagImpression("expanded_user_profile")

1

Braze.logFeatureFlagImpression("expanded_user_profile");

1

Appboy.AppboyBinding.LogFeatureFlagImpression("expanded_user_profile");

1

BrazePlugin.logFeatureFlagImpression("expanded_user_profile");

1

braze.logFeatureFlagImpression("expanded_user_profile");

1

m.Braze.logFeatureFlagImpression("expanded_user_profile");

Zugriff auf Eigenschaften

Um auf die Eigenschaften eines Feature-Flags zuzugreifen, verwenden Sie je nach dem im Dashboard definierten Typ eine der folgenden Methoden.

Wenn für den von Ihnen angegebenen Schlüssel keine Eigenschaft des entsprechenden Typs vorhanden ist, geben diese Methoden null zurück.

• web
• swift
• android
• react native
• unity
• cordova
• flutter
• roku

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

// Returns the Feature Flag instance
const featureFlag = braze.getFeatureFlag("expanded_user_profile");

// Returns the String property
const stringProperty = featureFlag.getStringProperty("color");

// Returns the boolean property
const booleanProperty = featureFlag.getBooleanProperty("expanded");

// Returns the number property
const numberProperty = featureFlag.getNumberProperty("height");

// Returns the Unix UTC millisecond timestamp property as a number
const timestampProperty = featureFlag.getTimestampProperty("account_start");

// Returns the image property as a String of the image URL
const imageProperty = featureFlag.getImageProperty("homepage_icon");

// Returns the JSON object property as a FeatureFlagJsonPropertyValue
const jsonProperty = featureFlag.getJsonProperty("footer_settings");

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

// Returns the Feature Flag instance
let featureFlag: FeatureFlag = braze.featureFlags.featureFlag(id: "expanded_user_profile")

// Returns the string property
let stringProperty: String? = featureFlag.stringProperty(key: "color")

// Returns the boolean property
let booleanProperty: Bool? = featureFlag.boolProperty(key: "expanded")

// Returns the number property as a double
let numberProperty: Double? = featureFlag.numberProperty(key: "height")

// Returns the Unix UTC millisecond timestamp property as an integer
let timestampProperty: Int? = featureFlag.timestampProperty(key: "account_start")

// Returns the image property as a String of the image URL
let imageProperty: String? = featureFlag.imageProperty(key: "homepage_icon")

// Returns the JSON object property as a [String: Any] dictionary
let jsonObjectProperty: [String: Any]? = featureFlag.jsonObjectProperty(key: "footer_settings")

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

// Returns the Feature Flag instance
FeatureFlag featureFlag = braze.getFeatureFlag("expanded_user_profile");

// Returns the String property
String stringProperty = featureFlag.getStringProperty("color");

// Returns the boolean property
Boolean booleanProperty = featureFlag.getBooleanProperty("expanded");

// Returns the number property
Number numberProperty = featureFlag.getNumberProperty("height");

// Returns the Unix UTC millisecond timestamp property as a long
Long timestampProperty = featureFlag.getTimestampProperty("account_start");

// Returns the image property as a String of the image URL
String imageProperty = featureFlag.getImageProperty("homepage_icon");

// Returns the JSON object property as a JSONObject
JSONObject jsonObjectProperty = featureFlag.getJSONProperty("footer_settings");

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

// Returns the Feature Flag instance
val featureFlag = braze.getFeatureFlag("expanded_user_profile")

// Returns the String property
val stringProperty: String? = featureFlag.getStringProperty("color")

// Returns the boolean property
val booleanProperty: Boolean? = featureFlag.getBooleanProperty("expanded")

// Returns the number property
val numberProperty: Number? = featureFlag.getNumberProperty("height")

// Returns the Unix UTC millisecond timestamp property as a long
val timestampProperty: Long? = featureFlag.getTimestampProperty("account_start")

// Returns the image property as a String of the image URL
val imageProperty: String?  = featureFlag.getImageProperty("homepage_icon")

// Returns the JSON object property as a JSONObject
val jsonObjectProperty: JSONObject? = featureFlag.getJSONProperty("footer_settings")

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

// Returns the String property
const stringProperty = await Braze.getFeatureFlagStringProperty("expanded_user_profile", "color");

// Returns the boolean property
const booleanProperty = await Braze.getFeatureFlagBooleanProperty("expanded_user_profile", "expanded");

// Returns the number property
const numberProperty = await Braze.getFeatureFlagNumberProperty("expanded_user_profile", "height");

// Returns the Unix UTC millisecond timestamp property as a number
const timestampProperty = await Braze.getFeatureFlagTimestampProperty("expanded_user_profile", "account_start");

// Returns the image property as a String of the image URL
const imageProperty = await Braze.getFeatureFlagImageProperty("expanded_user_profile", "homepage_icon");

// Returns the JSON object property as an object
const jsonObjectProperty = await Braze.getFeatureFlagJSONProperty("expanded_user_profile", "footer_settings");

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

// Returns the Feature Flag instance
var featureFlag = Appboy.AppboyBinding.GetFeatureFlag("expanded_user_profile");

// Returns the String property
var stringProperty = featureFlag.GetStringProperty("color");

// Returns the boolean property
var booleanProperty = featureFlag.GetBooleanProperty("expanded");

// Returns the number property as an integer
var integerProperty = featureFlag.GetIntegerProperty("height");

// Returns the number property as a double
var doubleProperty = featureFlag.GetDoubleProperty("height");

// Returns the Unix UTC millisecond timestamp property as a long
var timestampProperty = featureFlag.GetTimestampProperty("account_start");

// Returns the image property as a String of the image URL
var imageProperty = featureFlag.GetImageProperty("homepage_icon");

// Returns the JSON object property as a JSONObject
var jsonObjectProperty = featureFlag.GetJSONProperty("footer_settings");

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

// Returns the String property
const stringProperty = await BrazePlugin.getFeatureFlagStringProperty("expanded_user_profile", "color");

// Returns the boolean property
const booleanProperty = await BrazePlugin.getFeatureFlagBooleanProperty("expanded_user_profile", "expanded");

// Returns the number property
const numberProperty = await BrazePlugin.getFeatureFlagNumberProperty("expanded_user_profile", "height");

// Returns the Unix UTC millisecond timestamp property as a number
const timestampProperty = await BrazePlugin.getFeatureFlagTimestampProperty("expanded_user_profile", "account_start");

// Returns the image property as a String of the image URL
const imageProperty = await BrazePlugin.getFeatureFlagImageProperty("expanded_user_profile", "homepage_icon");

// Returns the JSON object property as an object
const jsonObjectProperty = await BrazePlugin.getFeatureFlagJSONProperty("expanded_user_profile", "footer_settings");

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

// Returns the Feature Flag instance
BrazeFeatureFlag featureFlag = await braze.getFeatureFlagByID("expanded_user_profile");

// Returns the String property
var stringProperty = featureFlag.getStringProperty("color");

// Returns the boolean property
var booleanProperty = featureFlag.getBooleanProperty("expanded");

// Returns the number property
var numberProperty = featureFlag.getNumberProperty("height");

// Returns the Unix UTC millisecond timestamp property as an integer
var timestampProperty = featureFlag.getTimestampProperty("account_start");

// Returns the image property as a String of the image URL
var imageProperty = featureFlag.getImageProperty("homepage_icon");

// Returns the JSON object property as a Map<String, dynamic> collection
var jsonObjectProperty = featureFlag.getJSONProperty("footer_settings");

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

' Returns the String property
color = featureFlag.getStringProperty("color")

' Returns the boolean property
expanded = featureFlag.getBooleanProperty("expanded")

' Returns the number property
height = featureFlag.getNumberProperty("height")

' Returns the Unix UTC millisecond timestamp property
account_start = featureFlag.getTimestampProperty("account_start")

' Returns the image property as a String of the image URL
homepage_icon = featureFlag.getImageProperty("homepage_icon")

' Returns the JSON object property
footer_settings = featureFlag.getJSONProperty("footer_settings")

Abrufen einer Liste aller Feature-Flags

• web
• swift
• android
• react native
• unity
• cordova
• flutter
• roku

1
2
3
4

const features = getAllFeatureFlags();
for(const feature of features) {
  console.log(`Feature: ${feature.id}`, feature.enabled);
}

1
2
3
4

let features = braze.featureFlags.featureFlags
for let feature in features {
  print("Feature: \(feature.id)", feature.enabled)
}

1
2
3
4

List<FeatureFlag> features = braze.getAllFeatureFlags();
for (FeatureFlag feature: features) {
  Log.i(TAG, "Feature: ", feature.getId(), feature.getEnabled());
}

1
2
3
4

val featureFlags = braze.getAllFeatureFlags()
featureFlags.forEach { feature ->
  Log.i(TAG, "Feature: ${feature.id} ${feature.enabled}")
}

1
2
3
4

const features = await Braze.getAllFeatureFlags();
for(const feature of features) {
  console.log(`Feature: ${feature.id}`, feature.enabled);
}

1
2
3
4

List<FeatureFlag> features = Appboy.AppboyBinding.GetAllFeatureFlags();
foreach (FeatureFlag feature in features) {
  Console.WriteLine("Feature: {0} - enabled: {1}", feature.ID, feature.Enabled);
}

1
2
3
4

const features = await BrazePlugin.getAllFeatureFlags();
for(const feature of features) {
  console.log(`Feature: ${feature.id}`, feature.enabled);
}

1
2
3
4

List<BrazeFeatureFlag> featureFlags = await braze.getAllFeatureFlags();
featureFlags.forEach((feature) {
  print("Feature: ${feature.id} ${feature.enabled}");
});

1
2
3
4

features = m.braze.getAllFeatureFlags()
for each feature in features
      print "Feature: " + feature.id + " enabled: " + feature.enabled.toStr()
end for

Aktualisieren von Feature-Flags

Sie können die Feature-Flags der aktuellen Nutzer:in während der Sitzung aktualisieren, um die neuesten Werte aus Braze abzurufen.

Tipp

Die Aktualisierung erfolgt automatisch beim Sitzungsstart. Eine Aktualisierung ist nur vor wichtigen Nutzeraktionen erforderlich, z. B. vor dem Laden einer Checkout-Seite, oder wenn Sie wissen, dass ein Feature-Flag referenziert werden wird.

• web
• swift
• android
• react native
• unity
• cordova
• flutter
• roku

1
2
3
4
5

braze.refreshFeatureFlags(() => {
  console.log(`Feature flags have been refreshed.`);
}, () => {
  console.log(`Failed to refresh feature flags.`);
});

1
2
3
4
5
6
7
8

braze.featureFlags.requestRefresh { result in
  switch result {
  case .success(let features):
    print("Feature flags have been refreshed:", features)
  case .failure(let error):
    print("Failed to refresh feature flags:", error)
  }
}

1

braze.refreshFeatureFlags();

1

braze.refreshFeatureFlags()

1

Braze.refreshFeatureFlags();

1

Appboy.AppboyBinding.RefreshFeatureFlags();

1

BrazePlugin.refreshFeatureFlags();

1

braze.refreshFeatureFlags();

1

m.Braze.refreshFeatureFlags()

Auf Änderungen lauschen

Sie können das Braze SDK so konfigurieren, dass es Ihre App überwacht und aktualisiert, wenn das SDK Feature-Flags aktualisiert.

Dies ist nützlich, wenn Sie Ihre App aktualisieren möchten, falls eine Nutzer:in nicht mehr für ein Feature berechtigt ist – zum Beispiel, um einen Status in Ihrer App festzulegen, der darauf basiert, ob ein Feature aktiviert ist oder nicht, oder auf einem seiner Eigenschaftswerte.

• web
• swift
• android
• react native
• unity
• cordova
• flutter
• roku
• react hook

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55

import * as braze from "@braze/web-sdk";

// - Available in version 7.0.0+
// Register an event listener
const subscriptionId = braze.subscribeToFeatureFlagsEvents((event) => {
  switch (event.type) {
    case braze.ChannelEventType.CACHE_REPLAY:
      // Sent once, right away, with the feature flags that are already cached.
      // Evaluate your flags now instead of waiting for the network.
      console.log("Cached feature flags:", event.cacheSnapshot.featureFlags);
      break;

    case braze.ChannelEventType.CACHE_LOAD:
      // The cache changed without a refresh, such as after changeUser().
      // The snapshot can be empty, so reset any state from the previous user.
      console.log("Feature flags reloaded:", event.cacheSnapshot.featureFlags);
      break;

    case braze.ChannelEventType.DATA_UPDATED:
      // A refresh finished, even if no feature flags changed.
      console.log("Feature flags were updated:", event.cacheSnapshot.featureFlags);
      break;

    case braze.ChannelEventType.ERROR:
      switch (event.retryState) {
        case braze.RetryState.SDK_WILL_RETRY:
          // The SDK is retrying. Keep the current values and wait.
          break;
        case braze.RetryState.INTEGRATOR_MAY_RETRY: {
          // The SDK stopped retrying. Try again later, and limit how often you retry.
          const delayMs = event.rateLimitedUntil
            ? Math.max(event.rateLimitedUntil.getTime() - Date.now(), 0)
            : 30000;
          setTimeout(() => braze.refreshFeatureFlags(), delayMs);
          break;
        }
        case braze.RetryState.DO_NOT_RETRY:
          // The failure is final. For example, feature flags are disabled for this workspace.
          if (event.reason === braze.ChannelErrorReason.FEATURE_DISABLED) {
            // Fall back to the default behavior in your app.
          }
          break;
      }
      break;
  }
});

// Register an event listener
const deprecatedSubscriptionId = braze.subscribeToFeatureFlagsUpdates((features) => {
  console.log(`Features were updated`, features);
});

// Unregister this event listener
braze.removeSubscription(subscriptionId);
braze.removeSubscription(deprecatedSubscriptionId);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

// Create the feature flags subscription
// - You must keep a strong reference to the subscription to keep it active

// - Available in version 19.0.0+
let subscription = braze.featureFlags.subscribeToEvents { event in
  switch event {
  case .cacheReplay(let cacheSnapshot), .cacheLoad(let cacheSnapshot):
    print("Feature flags were updated:", cacheSnapshot.featureFlags)
  case .dataUpdated(let cacheSnapshot, _):
    print("Feature flags were updated:", cacheSnapshot.featureFlags)
  default:
    break
  }
}

// Cancel the subscription
subscription.cancel()

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

// - Available in version 44.0.0+
braze.subscribeToFeatureFlagsEvents(event -> {
  if (event instanceof FeatureFlagsEvent.CacheReplay) {
    logFeatureFlags(((FeatureFlagsEvent.CacheReplay) event).getCacheSnapshot());
  } else if (event instanceof FeatureFlagsEvent.CacheLoad) {
    logFeatureFlags(((FeatureFlagsEvent.CacheLoad) event).getCacheSnapshot());
  } else if (event instanceof FeatureFlagsEvent.DataUpdated) {
    logFeatureFlags(((FeatureFlagsEvent.DataUpdated) event).getCacheSnapshot());
  }
});

braze.subscribeToFeatureFlagsUpdates(event -> {
  for (FeatureFlag feature : event.getFeatureFlags()) {
    Log.i(TAG, "Feature: " + feature.getId() + " " + feature.getEnabled());
  }
});

private void logFeatureFlags(FeatureFlagsCacheSnapshot cacheSnapshot) {
  for (FeatureFlag feature : cacheSnapshot.getFeatureFlags()) {
    Log.i(TAG, "Feature: " + feature.getId() + " " + feature.getEnabled());
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

// - Available in version 44.0.0+
braze.subscribeToFeatureFlagsEvents { event ->
  when (event) {
    is FeatureFlagsEvent.CacheReplay -> logFeatureFlags(event.cacheSnapshot)
    is FeatureFlagsEvent.CacheLoad -> logFeatureFlags(event.cacheSnapshot)
    is FeatureFlagsEvent.DataUpdated -> logFeatureFlags(event.cacheSnapshot)
    else -> {}
  }
}

braze.subscribeToFeatureFlagsUpdates { event ->
  event.featureFlags.forEach { feature ->
    Log.i(TAG, "Feature: ${feature.id} ${feature.enabled}")
  }
}

private fun logFeatureFlags(cacheSnapshot: FeatureFlagsCacheSnapshot) {
  cacheSnapshot.featureFlags.forEach { feature ->
    Log.i(TAG, "Feature: ${feature.id} ${feature.enabled}")
  }
}

1
2
3
4

// Register an event listener
Braze.addListener(braze.Events.FEATURE_FLAGS_UPDATED, (featureFlags) => {
  console.log(`featureFlagUpdates`, JSON.stringify(featureFlags));
});

1
2
3
4

// Register an event listener
BrazePlugin.subscribeToFeatureFlagUpdates((featureFlags) => {
    console.log(`featureFlagUpdates`, JSON.stringify(featureFlags));
});

1
2
3
4
5
6
7
8
9

// Create stream subscription
StreamSubscription featureFlagsStreamSubscription;

featureFlagsStreamSubscription = braze.subscribeToFeatureFlags((featureFlags) {
  print("Feature flags were updated");
});

// Cancel stream subscription
featureFlagsStreamSubscription.cancel();

1
2

' Define a function called `onFeatureFlagChanges` to be called when feature flags are refreshed
m.BrazeTask.ObserveField("BrazeFeatureFlags", "onFeatureFlagChanges")

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

import { useEffect, useState } from "react";
import {
  ChannelEventType,
  FeatureFlag,
  getFeatureFlag,
  removeSubscription,
  subscribeToFeatureFlagsEvents,
  subscribeToFeatureFlagsUpdates,
} from "@braze/web-sdk";

export const useFeatureFlag = (id: string): FeatureFlag => {
  const [featureFlag, setFeatureFlag] = useState<FeatureFlag>(
    getFeatureFlag(id)
  );

  useEffect(() => {
    // - Available in version 7.0.0+
    const listener = subscribeToFeatureFlagsEvents((event) => {
      switch (event.type) {
        case ChannelEventType.CACHE_REPLAY:
        case ChannelEventType.CACHE_LOAD:
        case ChannelEventType.DATA_UPDATED:
          setFeatureFlag(getFeatureFlag(id));
          break;
      }
    });

    const deprecatedListener = subscribeToFeatureFlagsUpdates(() => {
      setFeatureFlag(getFeatureFlag(id));
    });

    return () => {
      removeSubscription(listener);
      removeSubscription(deprecatedListener);
    };
  }, [id]);

  return featureFlag;
};

Eine Beschreibung jedes Ereignisses, das subscribeToFeatureFlagsEvents (Android) und subscribeToEvents (Swift) liefern können, finden Sie in der Ereignistabelle unter Feature-Flags. Für Web finden Sie die Ereignistabelle unter Auf Änderungen lauschen.

Überprüfen der Nutzer:innen-Berechtigung

Um zu überprüfen, für welche Feature-Flags eine Nutzer:in in Braze berechtigt ist, gehen Sie zu Zielgruppe > Nutzer:innen suchen und suchen und wählen Sie dann eine Nutzer:in aus.

Im Tab Feature-Flag-Berechtigung können Sie die Liste der berechtigten Feature-Flags nach Plattform, App oder Gerät filtern. Sie können auch eine Vorschau der Payload anzeigen, die an die Nutzer:in zurückgegeben wird, indem Sie neben einem Feature-Flag auswählen.

Changelog anzeigen

Um das Changelog eines Feature-Flags anzuzeigen, öffnen Sie ein Feature-Flag und wählen Sie Changelog.

Hier können Sie überprüfen, wann eine Änderung vorgenommen wurde, wer die Änderung durchgeführt hat, zu welcher Kategorie sie gehört, und mehr.

Segmentieren mit Feature-Flags

Braze verfolgt automatisch, welche Nutzer:innen derzeit für ein Feature-Flag aktiviert sind. Sie können ein Segment erstellen oder Messaging gezielt ausrichten, indem Sie den Filter Feature-Flag verwenden. Weitere Informationen zum Filtern nach Segmenten finden Sie unter Erstellen eines Segments.

Hinweis

Um rekursive Segmente zu vermeiden, ist es nicht möglich, ein Segment zu erstellen, das auf andere Feature-Flags verweist.

Best Practices

Rollouts nicht mit Canvases oder Experimenten kombinieren

Um zu vermeiden, dass Nutzer:innen durch verschiedene Einstiegspunkte aktiviert und deaktiviert werden, sollten Sie entweder den Rollout-Schieberegler auf einen Wert größer als null setzen ODER das Feature-Flag in einem Canvas oder Experiment aktivieren. Als Best Practice sollten Sie den Rollout-Prozentsatz bei null belassen, wenn Sie ein Feature-Flag in einem Canvas oder Experiment verwenden möchten.

Namenskonventionen

Um Ihren Code klar und konsistent zu halten, sollten Sie das folgende Format verwenden, wenn Sie Ihre Feature-Flag-ID benennen:

1

BEHAVIOR_PRODUCT_FEATURE

Ersetzen Sie Folgendes:

Hier ist ein Beispiel für ein Feature-Flag, bei dem show das Verhalten, animation_profile das Produkt und driver das Feature ist:

1

show_animation_profile_driver

Vorausplanen

Gehen Sie immer auf Nummer sicher. Wenn Sie neue Features in Betracht ziehen, die möglicherweise einen Ausschalter benötigen, ist es besser, neuen Code mit einem Feature-Flag zu veröffentlichen und es nicht zu benötigen, als festzustellen, dass ein neues App-Update erforderlich ist.

Aussagekräftig sein

Fügen Sie Ihrem Feature-Flag eine Beschreibung hinzu. Obwohl dies ein optionales Feld in Braze ist, kann es helfen, Fragen zu beantworten, die andere beim Durchsuchen der verfügbaren Feature-Flags haben könnten.

• Kontaktdaten der Person, die für die Aktivierung und das Verhalten dieses Flags verantwortlich ist
• Wann dieses Flag deaktiviert werden sollte
• Links zu Dokumentation oder Hinweisen über das neue Feature, das dieses Flag steuert
• Eventuelle Abhängigkeiten oder Hinweise zur Nutzung des Features

Alte Feature-Flags bereinigen

Wir alle sind schuldig, Features länger als nötig bei 100 % Rollout aktiviert zu lassen.

Um Ihren Code (und Ihr Braze-Dashboard) sauber zu halten, entfernen Sie permanente Feature-Flags aus Ihrer Codebasis, nachdem alle Nutzer:innen aktualisiert haben und Sie die Option zum Deaktivieren des Features nicht mehr benötigen. Dies hilft, die Komplexität Ihrer Entwicklungsumgebung zu reduzieren und hält gleichzeitig Ihre Liste der Feature-Flags übersichtlich.