範例自訂小工具

AWS 在兩個 JavaScript 和 Python 中提供了示例自定義部件。您可以使用此清單中每個小工具的連結來建立這些範例小工具。或者，您也可以使用 CloudWatch 主控台建立和自訂 Widget。此清單中的連結會開啟 AWS CloudFormation 主控台，並使用 AWS CloudFormation 快速建立連結來建立自訂 Widget。

您也可以在上存取自訂小器具範例GitHub。

在此清單之後，將顯示每種語言的 Echo 小工具的完整範例。

JavaScript

在示例自定義部件 JavaScript

• Echo – 基本迴聲器，您可以用來測試 HTML 在自訂小工具中的顯示方式，而不必撰寫新的小工具。

• Hello World – 一個非常基本的入門小工具。

• 自訂小工具除錯器 – 偵錯器小工具，可顯示 Lambda 執行階段環境的實用資訊。

• 查詢 CloudWatch 日誌洞察 — 運行和編輯 CloudWatch 日誌見解查詢。

• 執行 Amazon Athena 查詢 — 執行和編輯 Athena 查詢。

• 呼叫 AWS API — 呼叫任何唯讀 AWS API，並以 JSON 格式顯示結果。

• 快速 CloudWatch 點陣 CloudWatch 圖 — 使用伺服器端呈現圖形，以便快速顯示。

• 從 CloudWatch 儀表板文本控件-顯示從指定 CloudWatch 儀表板的第一個文本控件。

• CloudWatch 以表格形式顯示測量結果資料 — 在表格中顯示原始 CloudWatch 測量結果資料。

• Amazon EC2 表 — 依 CPU 用量顯示前幾個 EC2 執行個體。此小工具也包含重新開機按鈕，預設為停用。

• AWS CodeDeploy 部署 — 顯示 CodeDeploy 部署。

• AWS Cost Explorer 報告 — 顯示所選時間範圍內每項 AWS 服務成本的報告。

• 顯示外部 URL 的內容 — 顯示可外部存取之 URL 的內容。

• 顯示 Simple Storage Service (Amazon S3) 物件 – 在您帳戶中顯示 Simple Storage Service (Amazon S3) 儲存貯體中的物件。

• 簡單的 SVG 圓餅圖 — 以 SVG 為基礎的圖形小工具範例。

Python

Python 中的範例自訂小工具

• Echo – 基本迴聲器，您可以用來測試 HTML 在自訂小工具中的顯示方式，而不必撰寫新的小工具。

• Hello World – 一個非常基本的入門小工具。

• 自訂小工具除錯器 – 偵錯器小工具，可顯示 Lambda 執行階段環境的實用資訊。

• 呼叫 AWS API — 呼叫任何唯讀 AWS API，並以 JSON 格式顯示結果。

• 快速 CloudWatch 點陣 CloudWatch 圖 — 使用伺服器端呈現圖形，以便快速顯示。

• 以電子郵件傳送儀表板快照 — 擷取目前儀表板的快照，然後將其傳送給電子郵件收件人。

• 將儀表板快照傳送至 Simple Storage Service (Amazon S3) — 擷取目前儀表板的快照，並將其存放在 Simple Storage Service (Amazon S3) 中。

• 從 CloudWatch 儀表板文本控件-顯示從指定 CloudWatch 儀表板的第一個文本控件。

• 顯示外部 URL 的內容 — 顯示可外部存取之 URL 的內容。

• RSS 讀取器 — 顯示 RSS 摘要。

• 顯示 Simple Storage Service (Amazon S3) 物件 – 在您帳戶中顯示 Simple Storage Service (Amazon S3) 儲存貯體中的物件。

• 簡單的 SVG 圓餅圖 — 以 SVG 為基礎的圖形小工具範例。

迴聲小部件 JavaScript

以下是中的 Echo 範例小器具 JavaScript。

const DOCS = `
## Echo
A basic echo script. Anything passed in the \`\`\`echo\`\`\` parameter is returned as the content of the custom widget.
### Widget parameters
Param | Description
---|---
**echo** | The content to echo back
 
### Example parameters
\`\`\` yaml
echo: <h1>Hello world</h1>
\`\`\`
`;
 
exports.handler = async (event) => {
    if (event.describe) {
        return DOCS;   
    }
    
    let widgetContext = JSON.stringify(event.widgetContext, null, 4);
    widgetContext = widgetContext.replace(/</g, '&lt;');
    widgetContext = widgetContext.replace(/>/g, '&gt;');
    
    return `${event.echo || ''}<pre>${widgetContext}</pre>`;
};

Python 中的 Echo 小工具

以下是在 Python 中的 Echo 範例小工具。

import json
     
DOCS = """
## Echo
A basic echo script. Anything passed in the ```echo``` parameter is returned as the content of the custom widget.
### Widget parameters
Param | Description
---|---
**echo** | The content to echo back
     
### Example parameters
``` yaml
echo: <h1>Hello world</h1>
```"""
 
def lambda_handler(event, context):
    if 'describe' in event:
        return DOCS
        
    echo = event.get('echo', '')
    widgetContext = event.get('widgetContext')
    widgetContext = json.dumps(widgetContext, indent=4)
    widgetContext = widgetContext.replace('<', '&lt;')
    widgetContext = widgetContext.replace('>', '&gt;')
        
    return f'{echo}<pre>{widgetContext}</pre>'

Java 中的 Echo 小工具

以下是在 Java 中的 Echo 範例小工具。

package example;
 
import com.amazonaws.services.lambda.runtime.Context;
import com.amazonaws.services.lambda.runtime.RequestHandler;
 
import com.google.gson.Gson;
import com.google.gson.GsonBuilder;
 
public class Handler implements RequestHandler<Event, String>{
 
  static String DOCS = ""
    + "## Echo\n"
    + "A basic echo script. Anything passed in the ```echo``` parameter is returned as the content of the custom widget.\n"
    + "### Widget parameters\n"
    + "Param | Description\n"
    + "---|---\n"
    + "**echo** | The content to echo back\n\n"
    + "### Example parameters\n"
    + "```yaml\n"
    + "echo: <h1>Hello world</h1>\n"
    + "```\n";
 
  Gson gson = new GsonBuilder().setPrettyPrinting().create();
 
  @Override
  public String handleRequest(Event event, Context context) {
 
    if (event.describe) {
      return DOCS;
    }
     
    return (event.echo != null ? event.echo : "") + "<pre>" + gson.toJson(event.widgetContext) + "</pre>";
  }
}
     
class Event {
 
    public boolean describe;
    public String echo;
    public Object widgetContext;
 
    public Event() {}
 
    public Event(String echo, boolean describe, Object widgetContext) {
        this.describe = describe;
        this.echo = echo;
        this.widgetContext = widgetContext;
    }
}