開發Asset compute中繼資料背景工作
自訂Asset compute背景工作可產生XMP (XML)資料,這些資料會傳回AEM並儲存為資產上的中繼資料。
常見使用案例包含:
- 與協力廠商系統(例如PIM (產品資訊管理系統))的整合,其中必須擷取其他中繼資料並儲存在資產上
- 與Adobe服務(例如內容和Commerce AI)整合,使用其他機器學習屬性來增強資產中繼資料
- 從資產的二進位檔衍生有關資產的中繼資料,並將其儲存為AEMas a Cloud Service中的資產中繼資料
您將要執行的動作
在本教學課程中,我們將建立Asset compute中繼資料背景工作,它會衍生影像資產中最常使用的顏色,並將顏色名稱寫入回AEM中的資產中繼資料。 雖然背景工作本身至關重要,但本教學課程將利用此背景工作來探索如何使用Asset compute背景工作將中繼資料回寫至AEMas a Cloud Service中的資產。
asset compute中繼資料工作者引動處理的邏輯流程
asset compute中繼資料背景工作程式的引動方式幾乎與相同 產生背景工作的二進位轉譯,主要差異在於傳回型別是XMP (XML)轉譯,其值也會寫入資產的中繼資料。
asset compute背景工作程式會在中實施Asset computeSDK背景工作API合約 renditionCallback(...)
函式,其概念為:
- 輸入: AEM資產的原始二進位檔和處理設定檔引數
- 輸出: XMP (XML)轉譯會保留至AEM資產作為轉譯,並保留至資產的中繼資料
- AEM作者服務會叫用Asset compute中繼資料背景工作,提供資產的 (1a) 原始二進位檔案,和 (1b) 處理設定檔中定義的任何引數。
- asset computeSDK會協調自訂Asset compute中繼資料背景工作程式的執行
renditionCallback(...)
函式,根據資產的二進位衍生出XMP (XML)轉譯 (1a) 以及任何處理設定檔引數 (1b). - asset compute工作者會將XMP (XML)表示法儲存至
rendition.path
. - 寫入的XMP (XML)資料
rendition.path
會透過Asset compute SDK傳輸至AEM Author Service,並公開為 (4a) 文字轉譯和 (4b) 保留至資產的中繼資料節點。
設定manifest.yml manifest
所有Asset compute背景工作都必須在 manifest.yml.
開啟專案的 manifest.yml
並新增可設定新背景工作的工作者專案,在此案例中 metadata-colors
.
記住 .yml
區分空格。
packages:
__APP_PACKAGE__:
license: Apache-2.0
actions:
worker:
function: actions/worker/index.js
web: 'yes'
runtime: 'nodejs:12'
limits:
timeout: 60000 # in ms
memorySize: 512 # in MB
concurrency: 10
annotations:
require-adobe-auth: true
metadata-colors:
function: actions/metadata-colors/index.js
web: 'yes'
runtime: 'nodejs:12'
limits:
memorySize: 512 # in MB
function
指向在中建立的工作者實作 下一步. 以語義方式為背景工作命名(例如 actions/worker/index.js
名稱可能更適合 actions/rendition-circle/index.js
),如下所示 工作者的URL 也會決定 worker的測試套裝資料夾名稱.
此 limits
和 require-adobe-auth
每個工作者分別設定。 在這個工作者中, 512 MB
配置記憶體時,程式碼會檢查(潛在)大型二進位影像資料。 其他 limits
會移除以使用預設值。
開發中繼資料背景工作 metadata-worker
在路徑的Asset compute專案中建立新的中繼資料背景工作JavaScript檔案 已為新背景工作定義manifest.yml,在 /actions/metadata-colors/index.js
安裝npm模組
安裝額外的npm模組(@adobe/asset-compute-xml, get-image-colors、和 color-namer),此元件會用於此Asset compute背景工作。
$ npm install @adobe/asset-compute-xmp
$ npm install get-image-colors
$ npm install color-namer
中繼資料背景工作代碼
此背景工作與 產生轉譯的背景工作,主要差異在於它會將XMP (XML)資料寫入 rendition.path
以儲存回AEM。
"use strict";
const { worker, SourceCorruptError } = require("@adobe/asset-compute-sdk");
const fs = require("fs").promises;
// Require the @adobe/asset-compute-xmp module to create XMP
const { serializeXmp } = require("@adobe/asset-compute-xmp");
// Require supporting npm modules to derive image colors from image data
const getColors = require("get-image-colors");
// Require supporting npm modules to convert image colors to color names
const namer = require("color-namer");
exports.main = worker(async (source, rendition, params) => {
// Perform any necessary source (input) checks
const stats = await fs.stat(source.path);
if (stats.size === 0) {
// Throw appropriate errors whenever an erring condition is met
throw new SourceCorruptError("source file is empty");
}
const MAX_COLORS = 10;
const DEFAULT_COLORS_FAMILY = 'basic';
// Read the color family parameter to use to derive the color names
let colorsFamily = rendition.instructions.colorsFamily || DEFAULT_COLORS_FAMILY;
if (['basic', 'hex', 'html', 'ntc', 'pantone', 'roygbiv'].indexOf(colorsFamily) === -1) {
colorsFamily = DEFAULT_COLORS_FAMILY;
}
// Use the `get-image-colors` module to derive the most common colors from the image
let colors = await getColors(source.path, { options: MAX_COLORS });
// Convert the color Chroma objects to their closest names
let colorNames = colors.map((color) => getColorName(colorsFamily, color));
// Serialize the data to XMP metadata
// These properties are written to the [dam:Asset]/jcr:content/metadata resource
// This stores
// - The list of color names is stored in a JCR property named `wknd:colors`
// - The colors family used to derive the color names is stored in a JCR property named `wknd:colorsFamily`
const xmp = serializeXmp({
// Use a Set to de-duplicate color names
"wknd:colors": [...new Set(colorNames)],
"wknd:colorsFamily": colorsFamily
}, {
// Define any property namespaces used in the above property/value definition
// These namespaces are automatically registered in AEM if they do not yet exist
namespaces: {
wknd: "https://wknd.site/assets/1.0/",
},
}
);
// Save the XMP metadata to be written back to the asset's metadata node
await fs.writeFile(rendition.path, xmp, "utf-8");
});
/**
* Helper function that derives the closest color name for the color, based on the colors family
*
* @param {*} colorsFamily the colors name family to use
* @param {*} color the color to convert to a name
*/
function getColorName(colorsFamily, color) {
if ('hex' === colorsFamily) { return color; }
let names = namer(color.rgb())[colorsFamily];
if (names.length >= 1) { return names[0].name; }
}
在本機執行中繼資料背景工作 development-tool
背景工作程式碼完成時,可使用本機Asset compute開發工具執行。
因為我們的Asset compute專案包含兩個背景工作(前一個 圓形轉譯 以及這個 metadata-colors
worker), asset compute開發工具的 設定檔定義會列出兩個背景工作者的執行設定檔。 第二個設定檔定義指向新的 metadata-colors
背景工作。
-
從Asset compute專案的根目錄
-
執行
aio app run
啟動Asset compute開發工具 -
在 選取檔案…… 下拉式清單,選取 影像範例 待處理
-
在第二個設定檔定義組態中,指向
metadata-colors
背景工作,更新"name": "rendition.xml"
當此背景工作產生XMP (XML)轉譯時。 或者,新增colorsFamily
引數(支援的值)basic
,hex
,html
,ntc
,pantone
,roygbiv
)。code language-json { "renditions": [ { "worker": "...", "name": "rendition.xml", "colorsFamily": "pantone" } ] }
-
點選 執行 並等待XML轉譯產生
- 由於兩個背景工作都列在設定檔定義中,因此兩個轉譯都會產生。 選擇性地指向以下連結的上層設定檔定義: 圓形轉譯背景工作 可刪除,以避免從開發工具中執行。
-
此 轉譯 區段會預覽所產生的轉譯。 點選
rendition.xml
若要下載檔案,並以VS Code (或您最愛的XML/文字編輯器)開啟檔案以供檢閱。
測試背景工作 test
中繼資料背景工作可使用以下工具進行測試: 與二進位轉譯相同的Asset compute測試架構. 唯一的區別是 rendition.xxx
測試案例中的檔案必須是預期的XMP (XML)轉譯。
-
在Asset compute專案中建立下列結構:
code language-none /test/asset-compute/metadata-colors/success-pantone/ file.jpg params.json rendition.xml
-
使用 範例檔案 作為測試案例的
file.jpg
. -
將下列JSON新增至
params.json
.code language-none { "fmt": "xml", "colorsFamily": "pantone" }
請注意
"fmt": "xml"
是指示測試套裝產生.xml
文字型轉譯。 -
提供中預期的XML
rendition.xml
檔案。 這可透過以下方式取得:- 透過開發工具執行測試輸入檔案並儲存(已驗證的) XML轉譯。
code language-none <?xml version="1.0" encoding="UTF-8"?><rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:wknd="https://wknd.site/assets/1.0/"><rdf:Description><wknd:colors><rdf:Seq><rdf:li>Silver</rdf:li><rdf:li>Black</rdf:li><rdf:li>Outer Space</rdf:li></rdf:Seq></wknd:colors><wknd:colorsFamily>pantone</wknd:colorsFamily></rdf:Description></rdf:RDF>
-
執行
aio app test
從Asset compute專案的根目錄執行所有測試套裝。
將背景工作部署至Adobe I/O Runtime deploy
若要從AEM Assets叫用這個新的中繼資料工作程式,必須使用命令將其部署到Adobe I/O Runtime:
$ aio app deploy
請注意,這將部署專案中的所有背景工作。 檢閱 未刪節的部署指示 瞭解如何部署到中繼和生產工作區。
與AEM處理設定檔整合 processing-profile
透過建立新的或修改現有的自訂處理設定檔服務來從AEM叫用背景工作程式,此自訂處理設定檔服務會叫用這個已部署的背景工作程式。
-
以身分登入AEMas a Cloud Service作者服務 AEM管理員
-
瀏覽至 工具>資產>處理設定檔
-
建立 新的,或 編輯 和現有,處理設定檔
-
點選 自訂 標籤,然後點選 新增
-
定義新服務
-
建立中繼資料轉譯:切換至使用中
-
端點:
https://...adobeioruntime.net/api/v1/web/wkndAemAssetCompute-0.0.1/metadata-colors
- 這是工作程式的URL,取得期間為 部署 或使用指令
aio app get-url
. 根據AEMas a Cloud Service環境,確保URL指向正確的工作區。
- 這是工作程式的URL,取得期間為 部署 或使用指令
-
服務引數
-
點選 新增引數
- 索引鍵:
colorFamily
- 值:
pantone
- 支援的值:
basic
,hex
,html
,ntc
,pantone
,roygbiv
- 支援的值:
- 索引鍵:
-
-
Mime型別
- 包括:
image/jpeg
,image/png
,image/gif
,image/svg
- 這是第三方npm模組唯一支援的MIME型別,用來衍生顏色。
- 排除:
Leave blank
- 包括:
-
-
點選 儲存 在右上方
-
將處理設定檔套用至AEM Assets資料夾(如果尚未套用)
更新中繼資料結構 metadata-schema
若要檢閱色彩中繼資料,請將影像中繼資料結構描述上的兩個新欄位,對應到背景工作填入的新中繼資料屬性。
-
在AEM Author服務中,瀏覽至 「工具>資產>中繼資料結構」
-
導覽至 預設 並選取和編輯 影像 並新增唯讀表單欄位以公開產生的色彩中繼資料
-
新增 單行文字
- 欄位標籤:
Colors Family
- 對應至屬性:
./jcr:content/metadata/wknd:colorsFamily
- 規則>欄位>停用編輯:已勾選
- 欄位標籤:
-
新增 多值文字
- 欄位標籤:
Colors
- 對應至屬性:
./jcr:content/metadata/wknd:colors
- 欄位標籤:
-
點選 儲存 在右上方
正在處理資產
將色彩中繼資料寫入資產的中繼資料後,請前往 [dam:Asset]/jcr:content/metadata
資源,此中繼資料已編制索引,可透過搜尋利用這些辭彙提高資產探索能力,而且這些辭彙甚至可回寫至資產的二進位檔案(如果存在的話) DAM中繼資料回寫 系統會在其上叫用工作流程。
AEM Assets中的中繼資料轉譯
asset compute中繼資料背景工作產生的實際XMP檔案也會儲存為資產上的分散式轉譯。 一般不會使用此檔案,而是使用套用至資產中繼資料節點的值,但背景工作的原始XML輸出可在AEM中使用。
Github上的metadata-colors背景工作代碼
最終的 metadata-colors/index.js
可在Github上取得,網址為:
最終的 test/asset-compute/metadata-colors
Github提供測試套裝,網址為: