DocsReferencesChangelog
Docs

임베디드 서명 요청

임베디드 서명 요청은 고객사의 사이트에서 바로 서명 요청 페이지를 통해 설정 정보를 수정, 추가하여 서명요청할 수 있는 기능입니다.

1. 초안 만들기

임베디드 서명 요청을 위해서는 서명 요청 페이지에 기본값으로 입력할 데이터를 초안으로 생성해야 합니다.
먼저 아래의 가장 기본적인 API 요청을 통해 임베디드 초안을 생성할 수 있습니다.
해당 요청을 통해 "근로계약서"를 제목으로 하는 초안을 생성합니다.

 

 

POST 임베디드 초안 생성 API

요청하기

curl --request POST \
  --url https://api.modusign.co.kr/embedded-drafts \
  --header 'Accept: application/json' \
  --header 'Authorization: Basic {인코딩된 API-KEY}' \
  --header 'Content-Type: application/json' \
  --data '{"title":"근로계약서"}'

응답 body

{
  "id": "XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX",
  "expiry": "2021-01-01T00:00:00.000Z",
  "embeddedUrl": "https://app.modusign.co.kr/embedded-draft/XXX?at=XXXXXXX..."
}

이 API 요청의 응답 예시는 위와 같습니다.
응답의 embeddedUrl 에는 접속 가능한 URL이 전달됩니다. 해당 URL은 2시간 동안만 유효합니다.

❗️

HTTP API를 클라이언트에서 호출하지 마세요!

API 호출에 사용되는 API KEY는 유저의 권한을 획득하는 민감한 데이터입니다.
클라이언트에 KEY를 노출해서는 안 되며, 서버 사이드에서 보호되어야 합니다.

 

 

2. 임베디드 URL 열기

해당 URL을 클라이언트로 전달하여, 새 창, 새 탭 또는 iframe 내에서 열 수 있습니다.
열린 URL 페이지를 통해 필요한 정보를 설정하여 서명 요청을 할 수 있습니다.

클라이언트 사이드

// 새탭으로 열기
window.open("https://app.modusign.co.kr/embedded-draft/XXX?at=XXXXXXX...");

// 새창으로 열기
window.open(
  'https://app.modusign.co.kr/embedded-draft/XXX?at=XXXXXXX...',
  '_blank', 
  'top=10, left=10, width=1440, height=900'
);

// iframe에 열기
var targetIframe = document.getElementById('target-iframe');
targetIframe.src = 'https://app.modusign.co.kr/embedded-draft/XXX?at=XXXXXXX...';

 

 

템플릿으로 초안 만들기

템플릿으로 서명 요청하기 와 같이 임베디드 서명 요청을 위한 초안을 만들 때에도 미리 만들어둔 템플릿을 이용할 수 있습니다.
아래의 "템플릿으로 임베디드 초안 생성 API"를 이용하여 초안 및 임베디드 URL을 생성합니다.

요청 body를 통해 템플릿에 정보를 추가 및 수정하는 방법은 템플릿으로 서명 요청하기를 참고해보세요.

curl --request POST \
  --url https://api.modusign.co.kr/embedded-drafts/create-with-template \
  --header 'Accept: application/json' \
  --header 'Content-Type: application/json' \
  --data '
{
  "templateId": "XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX",
  "document": {
    "title": "문서 제목",
    "participantMappings": [
      {
        "role": "근로자",
        "name": "홍길동",
        "signingMethod": {
          "type": "EMAIL",
          "value": "[email protected]"
        }
      }
    ]
  }
}
'

 

 

미리보기 모드

URL에 추가적으로 &mode=preview 를 붙여 미리보기 모드를 열 수 있습니다.
미리보기 모드에서는 문서에 추가내용 입력이 입력되었을 때의 모습을 확인할 수 있으며, 서명 요청 기능은 비활성화됩니다.

// 미리보기 모드로 열기
window.open("https://app.modusign.co.kr/embedded-draft/XXX?at=XXXXXXX..." + "&mode=preview");

Updated 11 months ago