Adobe Workfront API中的RTF文字欄位
建立對象:
- 開發人員
Adobe Workfront中的某些物件允許以RTF格式儲存文字。 在Workfront API中,RTF使用開放原始碼架構Draft.js儲存為JSON。
概觀範例
具有RTF格式的自訂欄位稱為RTF格式欄位,可以有下列相關的值:
範例:使用RTF文字自訂表單欄位擷取欄位值的基本GET請求:
<OBJ Code><OBJ ID><OBJ Code><OBJ ID>
範例:此請求將傳回JSON格式為RTF的欄位值,並儲存在RTF格式的parameterValue DE:Field中
{
data: {
ID: "5e85e3f10000b99e8cef10af4e5c6c7b",
name: "Zoom Integration Test",
objCode: "PROJ",
parameterValues: {
"DE:Field with rich text": "{"blocks":[{"key":"dpfce","text":"This is a regular text","type":"unstyled","depth":0,"inlineStyleRanges":[],"entityRanges":[],"data":{}},{"key":"a9ic6","text":"Bold text and regular text","type":"unstyled","depth":0,"inlineStyleRanges":[{"offset":0,"length":9,"style":"BOLD"}],"entityRanges":[],"data":{}},{"key":"1b2a4","text":"Italic text and regular text","type":"unstyled","depth":0,"inlineStyleRanges":[{"offset":0,"length":11,"style":"ITALIC"}],"entityRanges":[],"data":{}},{"key":"4dle1","text":"Underline text and regular text","type":"unstyled","depth":0,"inlineStyleRanges":[{"offset":0,"length":14,"style":"UNDERLINE"}],"entityRanges":[],"data":{}},{"key":"10mip","text":"With all formating and regular text","type":"unstyled","depth":0,"inlineStyleRanges":[{"offset":0,"length":18,"style":"BOLD"},{"offset":0,"length":18,"style":"ITALIC"},{"offset":0,"length":18,"style":"UNDERLINE"}],"entityRanges":[],"data":{}}],"entityMap":{}}",
"DE:Other Type of Field": "Value",
}
}
}
範例:此為上圖所示回應的格式化版本。
{
"blocks":[
{
"key":"dpfce",
"text":"This is a regular text",
"type":"unstyled",
"depth":0,
"inlineStyleRanges":[
],
"entityRanges":[
],
"data":{
}
},
{
"key":"a9ic6",
"text":"Bold text and regular text",
"type":"unstyled",
"depth":0,
"inlineStyleRanges":[
{
"offset":0,
"length":9,
"style":"BOLD"
}
],
"entityRanges":[
],
"data":{
}
},
{
"key":"1b2a4",
"text":"Italic text and regular text",
"type":"unstyled",
"depth":0,
"inlineStyleRanges":[
{
"offset":0,
"length":11,
"style":"ITALIC"
}
],
"entityRanges":[
],
"data":{
}
},
{
"key":"4dle1",
"text":"Underline text and regular text",
"type":"unstyled",
"depth":0,
"inlineStyleRanges":[
{
"offset":0,
"length":14,
"style":"UNDERLINE"
}
],
"entityRanges":[
],
"data":{
}
},
{
"key":"10mip",
"text":"With all formating and regular text",
"type":"unstyled",
"depth":0,
"inlineStyleRanges":[
{
"offset":0,
"length":18,
"style":"BOLD"
},
{
"offset":0,
"length":18,
"style":"ITALIC"
},
{
"offset":0,
"length":18,
"style":"UNDERLINE"
}
],
"entityRanges":[
],
"data":{
}
}
],
"entityMap":{
}
}
個區塊
儲存RTF內容的JSON物件由兩個主要部分組成:區塊和entityMap。
區塊是JSON物件,代表單行格式化文字。 由於單一自訂欄位可以有一行以上的文字,每行文字都有自己的區塊,每個區塊都會以稱為區塊的父項陣列中的元素來表示。
範例:在此,自訂欄位的每行文字都會對應至陣列區塊中的區塊元素。
由於每個區塊元素也是JSON物件,因此每個區塊都是由元素組成:key、text、type、depth、inlineStyleRanges、entityRanges和data。 這些元素各自的作用如下:
- 索引碼:該區塊的唯一識別碼。 索引鍵是用來透過entityMaps對應一行文字。 有關entityMaps的詳細資訊,請參閱本檔案的entityMaps區段。
- 文字:從自訂欄位儲存的文字內容行。
- 型別:說明所代表的文字型別。 例如,儲存在區塊中的文字行可能是清單的一部分。 如果該文字行是未排序清單的一部分,則其型別將定義為:unordered-list-item。
- 清單:目前不支援,但很快將可供使用。
- 深度:當直線是已排序或未排序清單的巢狀部分時,定義直線深度的引數。
- inlineStyleRanges:陣列,說明套用至目前區塊所代表文字行的格式化型別。
範例:以下是inlineStyleRanges陣列,說明字元層級的每個樣式。 在此案例中:從索引0 (位移: 0)開始的9個字元(長度: 9)已套用「粗體」樣式:
如果已將多種型別的格式套用至單一行,樣式將會對應至inlineStyleRanges陣列中的其他元素。
範例:以下是儲存包含混合格式化的文字行時區塊的外觀:粗體文字和斜體。
{
"key":"a9ic6",
"text":"Bold text and Italics",
"type":"unstyled",
"depth":0,
"inlineStyleRanges":[
{
"offset":0,
"length":21,
"style":"BOLD"
},
{
"offset":14,
"length":7,
"style":"ITALIC"
}
],
...
},
entityMaps和entityRanges
資料區塊可能會包含超連結等實體,或是連線至自訂文字欄位外部資料來源的其他樣式化格式。
範例
從JSON擷取純文字
提交具有RTF格式的自訂欄位時,所有文字都會儲存在陣列區塊中。 不過,每行全文字都會儲存在組成父陣列區塊的每個個別區塊元素內的文字引數中。 因此,為了擷取全文,需要擷取每一行獨立的文字,並將它們分割在一起。 若要達到此目的,可在區塊中的所有元素上循環,並將每個文字引數串連在一起,並使用行分隔符號(\n)。
範例:您的JS看起來可能如下所示:
const parameterValue = JSON.parse('{"blocks":[{"key":"dpfce","text":"This is a regular text","type":"unstyled","depth":0,"inlineStyleRanges":[],"entityRanges":[],"data":{}},{"key":"a9ic6","text":"Bold text and regular text","type":"unstyled","depth":0,"inlineStyleRanges":[{"offset":0,"length":9,"style":"BOLD"}],"entityRanges":[],"data":{}},{"key":"1b2a4","text":"Italic text and regular text","type":"unstyled","depth":0,"inlineStyleRanges":[{"offset":0,"length":11,"style":"ITALIC"}],"entityRanges":[],"data":{}},{"key":"4dle1","text":"Underline text and regular text","type":"unstyled","depth":0,"inlineStyleRanges":[{"offset":0,"length":14,"style":"UNDERLINE"}],"entityRanges":[],"data":{}},{"key":"10mip","text":"With all formating and regular text","type":"unstyled","depth":0,"inlineStyleRanges":[{"offset":0,"length":18,"style":"BOLD"},{"offset":0,"length":18,"style":"ITALIC"},{"offset":0,"length":18,"style":"UNDERLINE"}],"entityRanges":[],"data":{}}],"entityMap":{}}');
let plainText = "";
parameterValue.blocks.forEach((block) => {
plainText = plainText.concat(block.text, "\n");
})
console.log(plainText)
使用Workfront API儲存RTF文字欄位值
若要使用Workfront API儲存RTF文字欄位的下列值:
世界您好!!!
這是我的第一個RTF
-
將每一行文字組織到陣列區塊中的區塊元素中,建構代表您嘗試擷取之RTF文字欄位值的JSON。
{ "blocks":[ { "key":"0", "text":"Hello World!!!", }, { "key":"1", "text":"This is my first Rich Text", } ] }
-
使用inlineStyleRanges引數擷取RTF格式。
{ "blocks":[ { "key":"0", "text":"Hello World!!!", "inlineStyleRanges": [ { "offset":6, "length":11, "style":"BOLD" } ] }, { "key":"1", "text":"This is my first Rich Text", } ] }
-
若要擷取第二行,文字 RTF 必須同時以粗體和斜體格式化。
{ "blocks":[ { "key":"0", "text":"Hello World!!!", "inlineStyleRanges": [ { "offset":6, "length":11, "style":"BOLD" } ] }, { "key":"1", "text":"This is my first Rich Text", "inlineStyleRanges": [ { "offset":17, "length":26, "style":"BOLD" }, { "offset":17, "length":26, "style":"ITALIC" } ] } ], "entityMap":{ } }
NOTE
雖然初次發行期間不支援entityMap功能,但在要求中傳遞此JSON仍是必填欄位。 -
使用上述JSON上的stringify方法發出PUT請求並傳送更新。
<OBJ Code><OBJ ID>