직렬화

직렬화는 나중에 작업공간에 다시 로드할 수 있도록 작업공간의 상태를 저장합니다. 여기에는 저장할 블록, 변수 또는 플러그인의 상태를 직렬화하는 것이 포함됩니다. 쉬운 저장을 위해 저장해야 하는 모든 데이터를 텍스트 기반 형식으로 변환한 후 나중에 해당 기능을 완전히 작동하는 작업공간에 다시 로드할 수 있습니다.

Blockly는 이 데이터에 JSON과 XML이라는 두 가지 형식을 제공합니다. 새 프로젝트에는 JSON 시스템을 사용하고 XML을 사용하는 이전 프로젝트는 업그레이드하는 것이 좋습니다. XML 시스템은 기존 저장 형식입니다. 삭제되지는 않지만 새 기능이 추가되지는 않습니다.

JSON 시스템

JSON 직렬화 시스템은 여러 serializer로 구성됩니다. 블록 및 변수에는 serializer가 내장되어 있으며 추가 serializer를 등록할 수도 있습니다. 각 serializer는 특정 플러그인 또는 시스템의 상태를 직렬화하고 역직렬화합니다.

저장 및 로드

작업공간

workspaces 네임스페이스에서 saveload 메서드를 호출하여 전체 작업공간의 상태를 직렬화하거나 역직렬화할 수 있습니다.

const state = Blockly.serialization.workspaces.save(myWorkspace);
Blockly.serialization.workspaces.load(state, myWorkspace);

이러한 호출은 작업공간에 등록된 모든 개별 시스템(serializer로 표시됨)을 직렬화하거나 역직렬화합니다.

개별 블록

blocks 네임스페이스에서 saveappend 메서드를 호출하여 개별 블록을 직렬화하거나 역직렬화할 수 있습니다.

const blockJson = Blockly.serialization.blocks.save(myBlock);
const duplicateBlock =
    Blockly.serialization.blocks.append(blockJson, myWorkspace);

개별 시스템

연결된 serializer를 구성하고 saveload 메서드를 호출하여 개별 시스템 (예: 블록, 변수, 플러그인 등)을 직렬화하거나 역직렬화할 수 있습니다.

// Saves only the variables information for the workspace.
const serializer = new Blockly.serialization.variables.VariableSerializer();
const state = serializer.save(myWorkspace);
serializer.load(state, myWorkspace);

역직렬화 순서

JSON 시스템에는 명시적 역직렬화 순서가 있어 저장 내 상태의 복제를 더 쉽게 방지할 수 있습니다.

Blockly.serialization.workspaces.load가 호출되면 serializer에 우선순위에 따라 역직렬화할 상태가 지정됩니다. 자세한 내용은 Serializer 섹션에서 설명하며 그 목적은 Serializer가 다른 시스템의 상태에 종속되도록 허용하는 것입니다.

기본 제공 직렬화자의 역직렬화 순서는 다음과 같습니다.

  1. 변수가 역직렬화됩니다.
  2. 차단이 역직렬화됩니다. 개별 스택/최상위 블록은 임의의 순서로 역직렬화됩니다.
    1. 유형이 역직렬화됩니다. 이렇게 하면 블록의 init 메서드가 트리거되고 확장 프로그램이 혼합됩니다.
    2. 속성이 역직렬화됩니다. 여기에는 모든 블록에 적용할 수 있는 속성이 포함됩니다. 예: x, y,collapse, disabled, data 등
    3. 추가 상태는 역직렬화됩니다. 자세한 내용은 확장 프로그램 및 Mutators 문서를 참고하세요.
    4. 차단이 상위 요소 (있는 경우)에 연결됩니다.
    5. 아이콘이 역직렬화됩니다. 개별 아이콘은 임의의 순서로 역직렬화됩니다.
    6. 필드가 역직렬화됩니다. 개별 필드는 임의의 순서로 역직렬화됩니다.
    7. 입력 블록은 역직렬화됩니다. 여기에는 값 입력 및 문 입력에 연결된 블록이 포함됩니다. 개별 입력은 임의의 순서로 역직렬화됩니다.
    8. 다음 블록은 역직렬화됩니다.

추가 상태를 저장해야 하는 경우

블록의 경우 순서에서 더 높은 항목에 종속되는 순서가 더 낮은 경우 해당 데이터를 복제하여 추가 상태에 추가해야 합니다.

예를 들어 다음 블록이 연결된 경우에만 존재하는 필드가 있는 경우, 해당 필드의 상태가 역직렬화되기 전에 블록에 다음 블록에 관한 정보를 추가할 수 있습니다.

그러나 필드에 특정 값이 있는 경우에만 입력이 있는 경우에는 필드에 대한 정보를 추가 상태에 추가할 필요가 없습니다. 이는 필드 상태가 먼저 역직렬화되기 때문에 필드의 값이 블록에 추가될 수 있기 때문입니다. 일반적으로 입력 추가는 검사기에 의해 트리거됩니다.

또한 상태 중복에 관한 규칙은 블록 스택, 아이콘, 필드, 입력 블록이 임의의 순서로 역직렬화된다는 점도 고려해야 합니다. 예를 들어 다른 필드 A에 특정 값이 있는 경우에만 필드 B가 존재하는 경우 A보다 B가 역직렬화될 경우를 대비해 추가 상태에 A에 관한 정보를 추가해야 합니다.

후크 차단

블록에 직렬화를 추가하는 방법에 관한 자세한 내용은 확장 프로그램 및 변형 문서를 참고하세요.

필드 후크

필드를 직렬화하는 방법은 커스텀 필드 문서를 참조하세요.

Serializer 후크

JSON 시스템을 사용하면 일부 상태를 직렬화 및 역직렬화하는 serializer를 등록할 수 있습니다. Blockly의 내장 Serializer는 블록과 변수에 관한 정보를 직렬화하지만 다른 정보를 직렬화하려면 자체 Serializer를 추가해야 합니다. 예를 들어 JSON 시스템에서는 기본적으로 작업공간 수준의 댓글이 직렬화되지 않습니다. 직렬화하려면 추가 serializer를 등록해야 합니다.

추가 serializer는 종종 플러그인 상태를 직렬화 및 역직렬화하는 데 사용됩니다.

Blockly.serialization.registry.register(
    'workspace-comments',  // Name
    {
      save: saveFn,      // Save function
      load: loadFn,      // Load function
      clear: clearFn,    // Clear function
      priority: 10,      // Priority
    });

serializer를 등록할 때 다음 사항을 제공해야 합니다.

  • serializer의 이름으로, 데이터도 함께 저장됩니다.
  • Serializer와 연결된 플러그인/시스템의 상태를 save하는 함수입니다.
  • 상태를 clear하는 함수입니다.
  • 상태를 load하는 함수입니다.
  • priority: 역직렬화 순서를 결정하는 데 사용됩니다.

    Serializer의 우선순위는 내장된 우선순위를 기반으로 할 수 있습니다.

Blockly.serialization.workspaces.save가 호출되면 각 serializer의 save 함수가 호출되고 데이터가 최종 JSON 출력에 추가됩니다.

{
  "blocks": { ... },
  "workspaceComments": [ // Provided by workspace-comments serializer
    {
      "x": 239,
      "y": 31,
      "text": "Add 2 + 2"
    },
    // etc...
  ]
}

Blockly.serialization.workspaces.load가 호출되면 각 serializer가 우선순위에 따라 트리거됩니다. 우선순위 값이 더 많은 Serializer는 우선순위 값이 낮음인 Serializer보다 먼저 트리거됩니다.

serializer가 트리거되면 두 가지 결과가 발생합니다.

  1. 제공된 clear 함수가 호출됩니다. 이렇게 하면 추가 상태가 로드되기 전에 플러그인/시스템 상태가 깔끔합니다. 예를 들어 작업공간 댓글 Serializer는 작업공간에서 기존의 모든 주석을 삭제합니다.
  2. 제공된 load 함수가 호출됩니다.

XML 시스템

XML 시스템을 사용하면 작업공간을 XML 노드로 직렬화할 수 있습니다. 이는 Blockly의 원래 직렬화 시스템이었습니다. 이제 아이스박스로 처리되어 새로운 기능을 받을 수 없습니다. 따라서 가능하면 JSON 시스템을 사용하는 것이 좋습니다.

API

XML 시스템의 API에 관한 자세한 내용은 참조 문서를 확인하세요.

후크 차단

블록에 직렬화를 추가하는 방법에 관한 자세한 내용은 확장 프로그램 및 변형 문서를 참고하세요.

필드 후크

필드를 직렬화하는 방법은 커스텀 필드 문서를 참조하세요.

JSON과 XML 중에서 선택

XML보다는 JSON Serializer를 사용하는 것이 좋습니다. JSON 시스템을 사용하면 작업공간의 상태를 자바스크립트 객체로 직렬화할 수 있습니다. 이는 다음과 같은 이점이 있습니다.

  1. JSON은 쉽게 압축하거나 다른 형식으로 변환할 수 있습니다.
  2. JSON은 프로그래매틱 방식으로 작업하기 쉽습니다.
  3. JSON은 쉽게 데이터를 확장하고 데이터를 추가할 수 있습니다.

또한 XML 시스템은 더 이상 업데이트를 수신하지 않으며 JSON Serializer에 비해 이미 기능이 없습니다. 예를 들어 자체 JSON Serializer를 등록하여 플러그인 데이터 또는 추가한 맞춤설정과 같은 추가 데이터를 쉽게 저장하고 로드할 수 있습니다. XML 시스템에서는 이를 사용할 수 없습니다.

이전에 XML 직렬화를 사용한 경우 이전 가이드에서 업그레이드 방법을 알아보세요.