Adobe Workfront API의 리치 텍스트 필드
작성 대상:
- 개발자
Adobe Workfront의 일부 개체를 사용하면 서식 있는 텍스트 형식으로 텍스트를 저장할 수 있습니다. Workfront API 리치 텍스트는 오픈 소스 프레임워크 Draft.js를 사용하여 JSON으로 저장됩니다.
개요 예
서식 있는 텍스트 서식이 있는 사용자 지정 필드는 서식 있는 텍스트가 있는 필드 라고 하며 다음 값을 연결할 수 있습니다.
예: 사용자 지정 양식 필드 서식 있는 텍스트가 있는 필드 의 값을 검색하기 위한 기본 GET 요청입니다.
<OBJ Code><OBJ ID><OBJ Code><OBJ ID>
예: 이 요청은 parameterValue DE:Field with rich text 에 저장된 JSON의 Field with rich text 값을 반환합니다.
{
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":{
}
}
블록
리치 텍스트 콘텐츠를 저장하는 JSON 개체는 블록 및 entityMaps, 이렇게 두 부분으로 구성됩니다.
블록은 형식이 지정된 텍스트의 한 줄을 나타내는 JSON 개체입니다. 단일 사용자 지정 필드에는 두 개 이상의 텍스트 줄이 있을 수 있으므로 각 텍스트 줄에는 고유한 블록이 있으며 각 블록은 블록 이라는 상위 배열의 요소로 표시됩니다.
예: 사용자 지정 필드의 각 텍스트 줄을 배열 블록의 블록 요소에 매핑합니다.
각 블록 요소는 JSON 개체이므로 각 블록은 key, text, type, depth, inlineStyleRanges, entityRanges 및 data 요소로 구성됩니다. 이러한 각 요소는 다음과 같이 작동합니다.
- Key 은(는) 해당 블록의 고유 식별자입니다. 키는 entityMaps를 통해 텍스트 행을 매핑하는 데 사용됩니다. entityMaps에 대한 자세한 내용은 이 문서의 entityMaps 섹션에서 확인할 수 있습니다.
- 텍스트 은(는) 사용자 지정 필드에서 저장 중인 텍스트 내용 줄입니다.
- Type 은(는) 표시 중인 텍스트 형식을 설명합니다. 예를 들어 블록에 저장되는 텍스트 줄이 목록의 일부일 수 있습니다. 해당 텍스트 줄이 비순차 목록에 포함된 경우 해당 유형은 비순차 목록-항목으로 정의됩니다.
- 목록은 현재 지원되지 않지만 곧 사용할 수 있습니다.
- 깊이 이 매개 변수는 선이 순서가 지정된 목록의 중첩된 부분이거나 순서가 지정되지 않은 부분인 경우 선의 깊이를 정의합니다.
- 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"
}
],
...
},
NOTEentityMaps 및 entityRanges
데이터 블록에는 사용자 지정 텍스트 필드 외부에 있는 데이터 소스에 연결된 하이퍼링크나 기타 유형의 양식화된 서식과 같은 엔티티가 포함될 수 있습니다.
예시
JSON에서 일반 텍스트 검색
서식 있는 텍스트 형식의 사용자 지정 필드를 제출하면 모든 텍스트가 블록 배열에 저장됩니다. 그러나 전체 텍스트의 각 행은 상위 배열 블록 을 구성하는 각 블록 요소 내의 text 매개 변수 에 저장됩니다. 따라서 전체 텍스트를 검색하려면 각 개별 텍스트 행을 추출하여 다시 한 쪽으로 나란히 배치해야 합니다. 이렇게 하려면 블록의 모든 요소를 반복하고 각 텍스트 매개 변수를 줄 구분 기호(\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를 사용하여 리치 텍스트 필드 값 저장
Workfront API를 사용하여 서식 있는 텍스트 필드의 다음 값을 저장하려면
World!!! 님, 안녕하세요.
내 첫 서식 있는 텍스트입니다.
-
각 텍스트 행을 배열 블록 의 블록 요소로 구성하여 캡처하려는 서식 있는 텍스트 필드의 값을 나타내는 JSON을 구성합니다.
{ "blocks":[ { "key":"0", "text":"Hello World!!!", }, { "key":"1", "text":"This is my first Rich Text", } ] } -
inlineStyleRanges 매개 변수를 사용하여 서식 있는 텍스트 서식 캡처
{ "blocks":[ { "key":"0", "text":"Hello World!!!", "inlineStyleRanges": [ { "offset":6, "length":11, "style":"BOLD" } ] }, { "key":"1", "text":"This is my first Rich Text", } ] } -
두 번째 줄을 캡처하려면 텍스트 "리치 텍스트"의 서식을 굵게, 기울임체로 지정해야 합니다.
{ "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>