ASK SDK v2 for Node.jsとAlexa Presentation Languageを合わせて使用する



ASK SDK v2 for Node.jsとAlexa Presentation Languageを合わせて使用する

このドキュメントでは、ASK SDK v2 for Node.jsを使用するスキルでAPLディレクティブを使用する方法の例を紹介します。この例では、画面に「ハローワールド」と表示します。

コードを更新する前に、APLインターフェースに対応するようスキルを設定します。

次の例では、「ハローワールド」スキル用のシンプルな関数を使用しています。この関数を、お使いのスキルに合わせて調整してください。

  • 以下のようなLaunchHandler関数があるとします。
const LaunchHandler = (input) => {
    const speechText = 'ようこそ、アレクサスキルキットへ。こんにちは、と言ってみてください。';
    const repromptText = 'こんにちは、と言ってみてください。';

    return input.responseBuilder
      .speak(speechText)
      .reprompt(repromptText)
      .getResponse();
  },
};
  • 次に、画面表示用のAPLテンプレートを作成し、main.jsonという名前のファイルとして保存します。

クリップボードにコピーされました。

{
  "type": "APL",
  "version": "1.1",
  "description": "シンプルな「ハローワールド」のAPLドキュメント"
  "settings": {},
  "theme": "dark",
  "import": [],
  "resources": [],
  "styles": {},
  "onMount": [],
  "graphics": {},
  "commands": {},
  "layouts": {},
  "mainTemplate": {
    "parameters": [
      "payload"
    ],
    "items": [
      {
        "type": "Text",
        "height": "100vh",
        "textAlign": "center",
        "textAlignVertical": "center",
        "text": "ハローワールド"
      }
    ]
  }
}
  • 最後に、元の関数を変更して、応答にこのAPLテンプレートを含めるようにします。このためには、responseBuilderaddDirective関数を呼び出して、Alexa.Presentation.APL.RenderDocumentディレクティブを追加します。オーサリングツールからコピーしたJSONコンテンツを追加するため、Node.jsのrequire()関数を使用して、このJSONコンテンツをAPLTemplateドキュメントの一部として読み込みます。

この関数は、応答にAPLを含めるように変更されました。

const LaunchHandler = (input) => {
    const speechText = 'ようこそ、アレクサスキルキットへ。こんにちは、と言ってみてください。';
    const repromptText = 'こんにちは、と言ってみてください。';

    return input.responseBuilder
            .speak(speechText)
            .reprompt(repromptText)
            .addDirective({
                type: 'Alexa.Presentation.APL.RenderDocument',
                token: '[SkillProvidedToken]',
                version: '1.0',
                document: myDocument,
                datasources: {}
            })
            .getResponse();
  },
};