本文為英文版的機器翻譯版本，如內容有任何歧義或不一致之處，概以英文版為準。

# 新增包含 Liquid 的自動化
<a name="sms-custom-templates-step2-automate"></a>

我們的自訂範本系統使用 [Liquid](https://shopify.github.io/liquid/) 進行自動化。Liquid 是開放原始碼內嵌標記語言。在 Liquid，單一大括號與百分比符號之間的文字是說明或*標籤*，用以執行控制流程或重複等操作。雙邊大括號之間的文字是變數，或輸出變數值的*物件*。

Liquid 的最常見用途，是剖析來自輸入資訊清單檔案的資料，並提取相關變數來建立任務。除非有指定註釋前 Lambda，否則 Ground Truth 會自動產生任務。Ground Truth 傳回的 `taskInput` 物件或您的 [註釋前 Lambda](sms-custom-templates-step3-lambda-requirements.md#sms-custom-templates-step3-prelambda) 是範本中的 `task.input` 物件。

輸入資訊清單的屬性會以 `event.dataObject` 形式傳遞至您的範本。

**Example 資訊清單資料物件**  

```
{
  "source": "This is a sample text for classification",
  "labels": [ "angry" , "sad" , "happy" , "inconclusive" ],
  "header": "What emotion is the speaker feeling?"
}
```

**Example 使用變數的範例 HTML**  

```
<crowd-classifier 
  name='tweetFeeling'
  categories='{{ task.input.labels | to_json }}'
  header='{{ task.input.header }}' >
<classification-target>
  {{ task.input.source }}
</classification-target>
```

請注意上面將 ` | to_json` 新增至 `labels` 屬性。這是將輸入資訊清單陣列變成 JSON 陣列表示法的篩選條件。下一節將說明變數篩選條件。

下列清單包含兩種 Liquid 標籤，您可能會發現這些標籤對於自動化範本輸入資料處理很有用。如果您選取下列其中一種標籤類型，系統會將您重新導向至 Liquid 文件。
+ [控制流程](https://shopify.github.io/liquid/tags/control-flow/)：包括程式設計邏輯運算子，例如 `if/else`、`unless`、`case/when`。
+ [重複](https://shopify.github.io/liquid/tags/iteration/)：可讓您運用 for 迴圈等陳述式重複執行程式碼區塊。

  如需使用 Liquid 元素建立 for 迴圈的 HTML 範本範例，請參閱 GitHub 的 [translation-review-and-correction.liquid.html](https://github.com/aws-samples/amazon-sagemaker-ground-truth-task-uis/blob/8ae02533ea5a91087561b1daecd0bc22a37ca393/text/translation-review-and-correction.liquid.html)。

如需詳細資訊及文件，請前往 [Liquid 首頁](https://shopify.github.io/liquid/)。

## 變數篩選條件
<a name="sms-custom-templates-step2-automate-filters"></a>

除標準 [Liquid 篩選條件](https://shopify.github.io/liquid/filters/abs/)與動作外，Ground Truth 也提供幾個額外篩選條件。篩選條件的套用方式，是透過將管道 (`|`) 字元放置於變數名稱後，再指定篩選條件名稱。篩選條件可以透過下列形式來串連：

**Example**  

```
{{ <content> | <filter> | <filter> }}
```

### 自動逸出和明確逸出
<a name="sms-custom-templates-step2-automate-filters-autoescape"></a>

根據預設，輸入將進行 HTML 逸出，以防止變數文字和 HTML 之間的混淆。您可以明確新增 `escape` 篩選條件，讓讀取範本來源的人明白逸出正在進行。

### escape\_once
<a name="sms-custom-templates-step2-automate-escapeonce"></a>

`escape_once` 可確保如果您已完成逸出您的程式碼，即不會重新逸出。例如，&amp; 不會變成 &amp;amp;。

### skip\_autoescape
<a name="sms-custom-templates-step2-automate-skipautoescape"></a>

`skip_autoescape` 當您的內容預定用做 HTML 時會有很幫助。例如，邊界框的完整說明中可能有幾段文字和一些影像。

**請謹慎使用 `skip_autoescape`**  
範本中的最佳實務是避免使用 `skip_autoescape` 來傳遞功能性程式碼或標記，除非您非常確定您可以嚴格控制傳遞內容。如果您傳遞使用者輸入，您可能會讓您的工作者面臨跨網站指令碼攻擊。

### to\_json
<a name="sms-custom-templates-step2-automate-tojson"></a>

`to_json` 會將您提供給 JSON (JavaScript 物件標記法) 的內容進行編碼。如果您提供物件，則會將該物件序列化。

### grant\_read\_access
<a name="sms-custom-templates-step2-automate-grantreadaccess"></a>

`grant_read_access` 會接受 S3 URI 並將其編碼為 HTTPS URL，含有該資源的短期存取權杖。這能夠將存放在 S3 儲存貯體中的照片、音訊或影片物件顯示給工作者，這些物件在其他情況下不可公開存取。

### s3\_presign
<a name="sms-custom-templates-step2-automate-s3"></a>

 `s3_presign` 篩選條件的運作方式與 `grant_read_access` 篩選條件相同。`s3_presign` 採用 Amazon S3 URI，並將其編碼為具該資源短期存取字符的 HTTPS URL。這能夠將存放在 S3 儲存貯體中的照片、音訊或影片物件顯示給工作者，這些物件在其他情況下無法公開存取。

**Example 變數篩選條件**  
輸入  

```
auto-escape: {{ "Have you read 'James & the Giant Peach'?" }}
explicit escape: {{ "Have you read 'James & the Giant Peach'?" | escape }}
explicit escape_once: {{ "Have you read 'James &amp; the Giant Peach'?" | escape_once }}
skip_autoescape: {{ "Have you read 'James & the Giant Peach'?" | skip_autoescape }}
to_json: {{ jsObject | to_json }}                
grant_read_access: {{ "s3://amzn-s3-demo-bucket/myphoto.png" | grant_read_access }}
s3_presign: {{ "s3://amzn-s3-demo-bucket/myphoto.png" | s3_presign }}
```

**Example**  
Output  

```
auto-escape: Have you read &#39;James &amp; the Giant Peach&#39;?
explicit escape: Have you read &#39;James &amp; the Giant Peach&#39;?
explicit escape_once: Have you read &#39;James &amp; the Giant Peach&#39;?
skip_autoescape: Have you read 'James & the Giant Peach'?
to_json: { "point_number": 8, "coords": [ 59, 76 ] }
grant_read_access: https://s3.amazonaws.com/amzn-s3-demo-bucket/myphoto.png?{{<access token and other params>}}
s3_presign: https://s3.amazonaws.com/amzn-s3-demo-bucket/myphoto.png?{{<access token and other params>}}
```

**Example 自動化分類範本。**  
若要自動執行簡易文字分類範例，請將推文文字取代為變數。  
自動化的文字分類範本如下，其中已新增自動化。變更/新增內容以粗體顯示。  

```
<script src="https://assets.crowd.aws/crowd-html-elements.js"></script>
<crowd-form>
  <crowd-classifier 
    name="tweetFeeling"
    categories="['positive', 'negative', 'neutral', 'cannot determine']"
    header="Which term best describes this tweet?" 
  >
    <classification-target>
       {{ task.input.source }}
    </classification-target>

    <full-instructions header="Analyzing a sentiment">
      Try to determine the feeling the author 
      of the tweet is trying to express. 
      If none seem to match, choose "other."
    </full-instructions>

    <short-instructions>
      Pick the term best describing the sentiment 
      of the tweet. 
    </short-instructions>

  </crowd-classifier>
</crowd-form>
```
先前範例中的推文文字現在已取代為物件。`entry.taskInput` 物件會使用 `source` (或您在註釋前 Lambda 中指定的其他名稱) 作為文字的屬性名稱，並藉由用雙大括號括住，將其直接插入 HTML。