APLドキュメントのインポートと書き出し



APLドキュメントのインポートと書き出し

APLドキュメントを書き出して、ドキュメントとデータソースを含むJSONファイルを作成します。以前に書き出したドキュメントを読み込んで新しいドキュメントを作成することもできます。

以下のセクションでは、APLドキュメント全体を書き出したり読み込んだりする方法について説明します。また、Lottie形式のアニメーションをインポートすることもできます。Lottieの詳細については、Lottieアニメーションのインポートを参照してください。

APLドキュメントをJSONに書き出す

オーサリングツールからドキュメントを書き出すと、トップレベルのdocumentdatasourcessourcesのプロパティを使ってドキュメント、データ、ソースを1つのJSONファイルにまとめられます。

{
  "document": {},
  "datasources": {
    "dataSourceName": {}
  },
  "sources": {
    "sourceName": {}
  }
}

このファイルにオーサリングツール以外で変更を加えた場合は、後でこのファイルを新規APLドキュメントとして再読み込みできます。

ドキュメントを書き出す

  1. 開発者コンソールで、ドキュメントを保存したスキルを開きます。
  2. 左側のナビゲーションから、マルチモーダルをクリックします。

    新しいウィンドウまたはタブでオーサリングツールが開き、オーディオフィルターが表示されます。

  3. オーディオ視覚のいずれかをクリックすると、既存のドキュメントのリストが表示されます。
  4. リストからドキュメントを探し、ダウンロードをクリックします。

ドキュメントの編集中にドキュメントを書き出すこともできます。右上隅のコードを書き出しボタン(コードを書き出しボタン)をクリックします。

書き出したドキュメントをスキルコードに使用する

APLドキュメントをJSONファイルに書き出したら、JSONをスキルコードにコピーして、RenderDocumentディレクティブにドキュメントを返すことができます。

RenderDocumentの詳細については、以下を参照してください。

JSONを書き出してコードにコピーする代わりに、RenderDocumentを返すときにオーサリングツールに保存したドキュメントへのリンクを指定できます。コードにJSONを組み込む代わりに応答にリンクすることで、コードが簡易化され、スキルデザイナーはコードに依存することなくオーサリングツールで応答を作成できます。詳細については、以下を参照してください。

JSONファイルからAPLドキュメントをインポートする(視覚応答)

JSONファイルから既存のAPLドキュメントをインポートすると、オーサリングツールはそのファイルに基づいて新しいドキュメントを作成します。

JSONファイルから視覚応答のAPLドキュメントをインポートする

  1. 開発者コンソールで、ドキュメントをインポートするスキルを開きます。
  2. 左側のナビゲーションから、マルチモーダルをクリックします。
  3. 視覚をクリックします。
  4. 視覚応答を作成をクリックします。
  5. アップロードをクリックし、JSONファイルをダイアログボックスにドラッグするか、参照をクリックしてコンピューター上のJSONファイルを選択します。
  6. アップロードをクリックします。

APLドキュメントのインポート形式

アップロードするJSONファイルは次のような構造にする必要があります。

{
  "document": {},
  "datasources": {
    "dataSourceName": {}
  },
  "sources": {
    "sourceName": {}
  }
}
プロパティ 説明 必須
document オブジェクト APLドキュメントのJSONが含まれます。
datasources データソースオブジェクトのマップ ドキュメントでテストするデータソースのマップです。
sources ソースオブジェクトのマップ ドキュメントのtypeAPLの場合に適用されます。APL for AudioトランスフォーマーでテストするAPL for Audioドキュメントのマップです。sourcesの使い方の詳細については、APLとAPL for Audioの統合をテストするを参照してください。

たとえば、以下のJSONファイルはデータソースやソースのないドキュメントをインポートしています。

{
  "document": {
    "type": "APL",
    "version": "1.6",
    "theme": "dark",
    "import": [],
    "resources": [],
    "styles": {},
    "layouts": {},
    "mainTemplate": {
      "parameters": [
        "payload"
      ],
      "items": [
      ]
    }
  }
}

この例は、documentdatasourcesのプロパティが両方含まれるファイルを示しています。

{
  "document": {
    "type": "APL",
    "version": "1.6",
    "theme": "dark",
    "import": [
      {
        "name": "alexa-layouts",
        "version": "1.3.0"
      }
    ],
    "mainTemplate": {
      "parameters": [
        "payload"
      ],
      "item": [
        {
          "type": "AlexaHeadline",
          "id": "PlantHeadline",
          "primaryText": "${payload.headlineTemplateData.properties.textContent.primaryText.text}",
          "headerBackButton": false,
          "headerAttributionImage": "${payload.headlineTemplateData.properties.logoUrl}",
          "headerAttributionPrimacy": true,
          "footerHintText": "${payload.headlineTemplateData.properties.hintText}",
          "backgroundImageSource": "${payload.headlineTemplateData.properties.backgroundImage.sources[0].url}",
          "backgroundColorOverlay": false,
          "speech": "${payload.headlineTemplateData.properties.welcomeSpeech}"
        }
      ]
    },
    "onMount": [
      {
        "type": "SpeakItem",
        "componentId": "PlantHeadline"
      }
    ]
  },
  "datasources": {
    "headlineTemplateData": {
      "type": "object",
      "objectId": "headlineSample",
      "properties": {
        "backgroundImage": {
          "contentDescription": null,
          "smallSourceUrl": null,
          "largeSourceUrl": null,
          "sources": [
            {
              "url": "https://d2o906d8ln7ui1.cloudfront.net/images/templates_v3/headline/HeadlineBackground_Dark.png",
              "size": "large"
            }
          ]
        },
        "textContent": {
          "primaryText": {
            "type": "PlainText",
            "text": "今日の植物トリビアにようこそ"
          }
        },
        "logoUrl": "https://d2o906d8ln7ui1.cloudfront.net/images/templates_v3/logo/logo-modern-botanical-white.png",
        "hintText": "次のように言ってみてください。\"アレクサ、今日の植物トリビアを教えて。\"",
        "welcomeSpeechSSML": "<speak><amazon:emotion name='excited' intensity='medium'>今日の植物トリビアにようこそ</amazon:emotion></speak>"
      },
      "transformers": [
        {
          "inputPath": "welcomeSpeechSSML",
          "transformer": "ssmlToSpeech",
          "outputName": "welcomeSpeech"
        }
      ]
    }
  },
  "sources": {}
}

この例では、APL for Audioドキュメントでテストするデータソースとソースを含むドキュメントを示しています。

別の方法として、オーサリングツールで直接データソースを作成または貼り付けることもできます。