So wie Sie Resource Bundles für Nachrichten in integrierten Komponenten, Antwort-Intents usw. verwenden können, können Sie auch Resource Bundles für Ihre benutzerdefinierten Komponenten verwenden. Dazu gehen Sie folgendermaßen vor:

1. Definieren Sie Resource Bundle-Einträge im Skill für Ihre Nachricht. Siehe Resource Bundle-Schlüssel erstellen.
2. Referenzieren Sie mit der context.translate()-Methode des Bots-Knoten-SDK die Resource Bundle-Schlüssel aus dem benutzerdefinierten Komponentencode.

   Die context.translate() verwendet einen angegebenen Resource Bundle-Schlüsselnamen (und alle im Resource Bundle-Eintrag angegebenen Parameter) und generiert die entsprechende FreeMarker-Vorlage, die zum Laden der Sprachzeichenfolge des benannten Resource Bundles erforderlich ist, wenn die Unterhaltung über die Methode context.reply() an den Benutzer zurückgesendet wird.

3. Verwenden Sie die Helper-Methode context.reply, um die übersetzte Antwort zu drucken. Beispiel:

   context.reply(translate('date.message', dateToday, dayOfWeek ));

4. Dokumentieren Sie alle Resource Bundle-Schlüssel, die von der benutzerdefinierten Komponente referenziert werden, sowie die erwarteten Standardzeichenfolgen. (Da die benutzerdefinierte Komponente den Resource Bundle-Schlüssel im Skill direkt referenziert, muss ein hohes Maß an Koordination zwischen dem Entwickler der benutzerdefinierten Komponente und den Entwicklern des Skills vorhanden sein, um sicherzustellen, dass die referenzierten Schlüssel im Skill gültig sind.)

In diesem Beispiel ist date.message ein Resource Bundle-Schlüssel, dateToday und dayOfWeek sind Variablen, und ein FreeMarker-Ausdruck wie der folgende wird zurückgegeben:

${rb('date.message', 'Monday', 'July 12, 2021')}

Mit einer Systemkomponente können Sie Nachrichten mithilfe von Resource-Bundle-Einträgen und Daten assemblieren, die von einer benutzerdefinierten Komponente zurückgegeben wurden. Sie definieren die Basisnachrichtenzeichenfolgen in Resource Bundle-Einträgen. Die Bundle-Einträge können Parameter für Daten (wie Zahlen und Datumsangaben) enthalten, die von der benutzerdefinierten Komponente ausgegeben werden. Da die Basisnachrichtenzeichenfolgen im Dialogablauf definiert sind, stellt diese Lösung sicher, dass benutzerdefinierte Komponenten nicht von einem bestimmten Implementierungscode abhängig sind und wiederverwendbar bleiben.

Allgemeine Schritte:

1. Fügen Sie für die benutzerdefinierte Komponente einen erforderlichen Eingabeparameter für den Namen der Kontextvariablen ein, in dem die zurückgegebenen Daten gespeichert werden sollen.
2. Da der Entwickler der benutzerdefinierten Komponente und der Entwickler des Dialogablaufs möglicherweise nicht dieselbe Person oder sogar demselben Team angehören, dokumentieren Sie sorgfältig, welche Daten die benutzerdefinierte Komponente in dieser Variablen zurückgibt, und stellen Sie die Informationen allen benutzerdefinierten Komponenten-Consumern zur Verfügung, damit sie verstehen, wie die zurückgegebenen Daten dem Benutzer in einer Nachricht angezeigt werden.
3. Erstellen Sie im Dialogablauf eine Variable, um die zurückgegebenen Daten der benutzerdefinierten Komponente zu speichern und ihren Namen im erforderlichen Eingabeparameter zu übergeben.
4. Definieren Sie Resource Bundle-Einträge im Skill für Ihre Nachricht. Siehe Resource Bundle-Schlüssel erstellen.
5. Referenzieren Sie im Dialogablauf den Resource Bundle-Eintrag, und geben Sie alle erforderlichen Parameter ein.

Das folgende Beispiel eines im YAML-Dialogmodus entwickelten Skills referenziert eine benutzerdefinierte Komponente im Status initializeReceipt und übergibt den Namen der Variablen (receipt), die die Komponentenantwort und purchaseId als Eingabeparameter enthält. Der Status printProduct enthält dann den Wert receipt als Parameter in einer Referenz auf den Resource Bundle-Eintrag mit dem Namen receiptMessage.

  initializeReceipt:
    component: "sample.receipt.dataresponse"
    properties:
      dataVariable: "receipt"
      purchaseId: "${purchaseId.value}"
 ...
  printProduct:
    component: "System.CommonResponse"
    properties:
      keepTurn: true
      metadata:
        responseItems:        
        - type: "text" 
          text: "${rb('receiptMessage','${receipt.value}')}"

Der benutzerdefinierte Code für den Zugriff auf diese Eingabeparameter könnte ungefähr wie der folgende Code aussehen:

module.exports = {
  metadata: () => ({
    name: 'myComponent',   
    properties: {
       dataVariable: { required: true, type: 'string' },    
       purchaseId: { required: true, type: 'string' },
    },
...
    // Retrieve the value of the 'dataVariable' component property.
    const { dataVariable } = context.properties();
    if (!dataVariable) {
      context.transition();
      done(new Error('The state is missing the dataVariable property.'));
    }
...
    // Retrieve the value of the 'purchaseId' component property.
    const { purchaseId } = context.properties();
    if (!purchaseId) {
      context.transition();
      done(new Error('The state is missing the purchaseId property.'));
    }
...
    context.setVariable(dataVariable, data);      
    context.transition();
    done();
  }
}

Wenn Sie nicht wissen können, wie der Antworttext der Komponente aussieht (z.B. wenn er von einem Remote-Backend abgefragt wird), können Sie die Antworten mit dem Übersetzungsservice des Skills übersetzen. Führen Sie hierzu die folgenden Schritte aus:

1. Stellen Sie sicher, dass die Ausgabe der Komponente an den Übersetzungsservice gesendet wird, indem Sie die Eigenschaft translate für die Komponente definieren und sie auf true setzen.
2. Verwenden Sie in der benutzerdefinierten Komponente die Helper-Methode context.reply, um die Antwort zurückzugeben.

Dieser Ansatz funktioniert nur mit Skills, die im Sprachmodus "Übersetzungsservice" eingerichtet sind.

Benutzerdefinierte Komponenten, die Backend-Services abfragen, können Daten in einem komplexen Format wie einem Objekt oder einem Array von Objekten zurückgeben. Wenn Sie einen Übersetzungsservice verwenden, können diese Datenobjekte nicht unverändert an den Übersetzungsservice gesendet werden. Stattdessen müssen Sie eine Nachricht erstellen, die alle erforderlichen Attribute des Datenobjekts einzeln referenziert.

1. Fügen Sie für die benutzerdefinierte Komponente einen erforderlichen Eingabeparameter für den Namen der Dialogablaufvariable ein, in der die zurückgegebenen Daten gespeichert werden sollen.
2. Da der Entwickler der benutzerdefinierten Komponente und der Entwickler des Dialogablaufs möglicherweise nicht dieselbe Person oder sogar demselben Team angehören, dokumentieren Sie sorgfältig, welche Daten die benutzerdefinierte Komponente in dieser Variablen zurückgibt, und stellen Sie die Informationen allen benutzerdefinierten Komponenten-Consumern zur Verfügung, damit sie verstehen, wie die zurückgegebenen Daten dem Benutzer in einer Nachricht angezeigt werden.
3. Erstellen Sie im Dialogablauf eine Variable, um die zurückgegebenen Daten der benutzerdefinierten Komponente zu speichern und ihren Namen im erforderlichen Eingabeparameter zu übergeben.
4. Stellen Sie die Antwort mithilfe der Informationen in der Variablen in einer Systemkomponente zusammen, wie z.B. Common Response.
5. Stellen Sie sicher, dass der Skill für die automatische Übersetzung konfiguriert ist.
   • Legen Sie für Skills, die im visuellen Dialogmodus entwickelt wurden, die Eigenschaft Botantwortnachricht übersetzen auf der Seite Einstellungen des Skills auf true fest.
   • Bei Skills, die im YAML-Dialogmodus entwickelt wurden, können Sie diese im Skill global verarbeiten, indem Sie die Kontextvariable autoTranslate festlegen. Beispiel:

       setAutoTranslate:
         component: "System.SetVariable"   
         properties:
           variable: "autoTranslate"     
           value:
            input: true
            output: true

responseItems:        
- type: "text" 
  text: "The product in your cart is a ${dialogVar.value.type}. It is
   ${dialogVar.value.product} from ${dialogVar.value.origin}"

Der benutzerdefinierte Code für den Zugriff auf diesen Eingabeparameter könnte ungefähr wie der folgende Code aussehen:

module.exports = {
  metadata: () => ({
    name: 'myComponent',   
    properties: {
       dialogVar: { required: true, type: 'string' },    
    },
...
    // Retrieve the value of the 'dialogVar' component property.
    const { dialogVar } = context.properties();
    if (!dialogVar) {
      context.transition();
      done(new Error('The state is missing the dialogVar property.'));
    }
...
    context.setVariable(dialogVar, data);    
    context.transition();
    done();
  }
}

Wenn die benutzerdefinierte Komponente die Sprache des Benutzers benötigt, um beispielsweise korrekte Datumsformate bereitzustellen, können Sie sie der Komponente auf eine der folgenden Arten bereitstellen:

• Greifen Sie über den benutzerdefinierten Komponentencode auf die Variablen profile.locale und profile.languageTag zu, wie im folgenden Beispiel dargestellt:

  //detect user locale. If not set, define a default
  const locale = context.getVariable('profile.locale') ?
                 context.getVariable('profile.locale') : 'en-AU';
  //Make sure locale is returned with hyphen, not underscore. JavaScript requires a hyphen.
  const jsLocale = locale.replace('_','-'); 
  //when profile languageTag is set, use it. If not, use profile.locale
  const languageTag = context.getVariable('profile.languageTag')?
                      context.getVariable('profile.languageTag') : jslocale;

• Übergeben Sie die Werte von profile.locale und/oder profile.languageTag als Eingabeparameter an die Komponente.