Zum Hauptinhalt springen
Verwenden Sie Client-seitige SDKs, die dem bevorzugten Framework entsprechen, um Experimente oder Feature Flags auszuführen. Wenn das Modul Feature Experimentation nicht verfügbar ist oder die SDK-Installation nicht gewünscht wird, folgen Sie der in diesem Artikel beschriebenen Problemumgehung, um Experimente mit der Activation API auszuführen.

​
Kontext

Moderne JavaScript-Client-seitige Frameworks (React, Angular, Vue usw.) verwalten den DOM-Baum und die Elemente (oft unter Verwendung eines virtuellen DOM). Diese interne Verwaltung erschwert die Implementierung von Client-seitigen Tests außerhalb des spezifischen Frameworks, da DOM-Manipulationen mit dem Framework-Verhalten in Konflikt geraten. Externe Änderungen an Elementen oder Logik werden häufig überschrieben. Für diese Probleme gibt es Problemumgehungen, wie die Verwendung von DOM Mutation Observers, aber externer Code muss diese sorgfältig handhaben. Anstatt einen aufdringlichen externen Ansatz zu verwenden, implementieren Sie Variationen direkt in der bestehenden React-, Angular- oder Vue-Codebasis und lösen Sie Experimente programmgesteuert aus. Diese Logik spiegelt die SDK-Nutzung wider — die Kameleoon-Frontend-Engine dient als Äquivalent zum JavaScript SDK.
Die in diesem Artikel beschriebenen Techniken erfordern eine erneute Bereitstellung des JS-Quellcodes, um Experimente oder Personalisierungen zu starten. Während dieser Ansatz das Codieren vereinfacht, fehlt ihm die Flexibilität standardmäßiger Kameleoon-Methoden, die Starts ohne IT-Bereitstellungen ermöglichen. Ein Entwickler mit Repository-Zugriff muss die Implementierung durchführen.Die externe Implementierung von JS-Experimenten (über Kameleoons injizierten Code) oder eine Kombination beider Ansätze bleibt möglich.
Um die hier vorgestellten Activation API-Methoden zu verwenden, installieren Sie Kameleoon in der Client-seitigen Anwendung gemäß dieser Dokumentation.
Der Installationsprozess entspricht dem einer Standardwebsite — fügen Sie eine externe JavaScript-Anwendungsdatei hinzu, die die Kameleoon-Engine und die Activation API enthält.
Stellen Sie sicher, dass Kameleoon vollständig geladen ist, bevor Sie Anwendungscode ausführen, der Experimente auslöst, indem Sie auf das Ereignis Kameleoon::Started lauschen. Alternativ können Sie das Kameleoon-Skript synchron in der HTML-Ladeseite vor dem Framework-Code laden.

​
Erstellung und Konfiguration des Experiments

Die Schritte entsprechen denen standardmäßiger A/B-Experimente (Erstellung von Variationen, Zielauswahl und Analyse-Integration). Beachten Sie die folgenden Anforderungen:
  • Erstellen Sie ein Experiment mit dem Code-Editor.
  • Wählen Sie die Targeting-Bedingung Expliziter Trigger, um das Experiment manuell über die API auszulösen.
Notieren Sie die Experiment- und Variations-IDs zur Verwendung im Code.
Lassen Sie den JS-Code für Variationen in den meisten Fällen leer. Das Einfügen von JSON-Daten in Variationen ist jedoch nützlich, um Parameter im Anwendungscode abzurufen; diese Parameter können in der Kameleoon-Oberfläche aktualisiert werden, ohne dass weitere erneute Bereitstellungen erforderlich sind.

​
Beispielcode zum Auslösen eines Experiments

Das folgende Codebeispiel zeigt, wie ein Experiment ausgelöst und die zugehörige Variation für den aktuellen Benutzer abgerufen wird. Kameleoon.API.Experiments.getAll() umfasst keine Experimente, die nicht über die Benutzeroberfläche gestartet werden. Diese Einrichtung ermöglicht es, Codebereitstellungen vorzubereiten und Experimente unabhängig zu starten — in der Regel planen IT-Teams die Bereitstellungen, während Product Owner die Starts terminieren. 
var variationID;

// Make sure Kameleoon is loaded and active at this point
var experiment = Kameleoon.API.Experiments.getById(75253);

/*
  The experiment is not currently live (not launched yet, or paused).
  The default behavior should take place.
*/
if (!experiment) {
  variationID = 0;
} else {
  Kameleoon.API.Experiments.trigger(experiment.id, false);

  /*
    The experiment is not activated, which usually means the user has not been
    assigned a variation (part of the traffic was not assigned to any variation),
    or capping requirements are not met. Again, the default behavior should happen.
  */
  if (!experiment.associatedVariation) {
    variationID = 0;
  } else {
    variationID = experiment.associatedVariation.id;

    /*
      Illustration of the JSON parameterization technique - the additionalParameters
      variable will now be equal to the JSON content we set in Kameleoon's back-office.
    */
    var additionalParameters = Kameleoon.API.Variations.execute(variationID);
  }
}

// This code implements the changes related to the experiment

if (0 == variationID) {
  // Default / reference number of products to display
  recommendedProductsNumber = 5;
} else if (148382 == variationID) {
  // Variation updating the number of recommended products to 10
  recommendedProductsNumber = 10;
} else if (187791 == variationID) {
  // Variation updating the number of recommended products to 8
  recommendedProductsNumber = 8;
}
Konfigurieren Sie den JS-Variationscode in der Kameleoon-Oberfläche wie folgt, um variationsabhängige JSON-Daten in der Anwendung abzurufen: 
return {timeout: 500, errorMessage: "Something went wrong", productIDs: [536, 892]};