Skip to main content
Question

How to get recipient signature image and consume it?


Forum|alt.badge.img+2

@All Community Care  i’m trying to download the recipient signature image.
how to  use it because i’m receiving the format like "GIF89aA\u0002�\u0000�\u0000\u0000\u0000\u0000\u0000\u0000\u00003\u0000\u0000f\u0000 ...”

how to consume on frontend to show image ?

 

10 replies

Michael.Rave
Docusign Employee
Forum|alt.badge.img+14
  • Docusign Employee
  • 927 replies
  • July 11, 2024

@Avinash Wagh 

Why do you want to download the recipient signature from Docusign eSignature? 

The recipient signature is part of the signed documents and also included in the Certificate of Completion. There is no use to download a signature as it is only valid in context of the signed documents and not standalone.


Forum|alt.badge.img+2
  • Author
  • New Voice
  • 7 replies
  • July 11, 2024

because on my app interface i want show it as the sign of completion of that step


Forum|alt.badge.img+2
  • Author
  • New Voice
  • 7 replies
  • July 11, 2024

@mrave

i’m facing issue with downloading the pdf from the docusign sdk .
getting the html template page from the sdk function response.
 

const document = await axios.get(

`${dsConfig.oauthBasePath}/restapi/v2.1/accounts/{accountId}/envelopes/{envelopId}/documents/1`,

{

headers: {

Authorization: 'Bearer ' + token,

 "Content-Type": "application/pdf",

 “Content-Disposition”: “attachment; filename=signed_document.pdf”

}

}

)

return document.data;


Michael.Rave
Docusign Employee
Forum|alt.badge.img+14
  • Docusign Employee
  • 927 replies
  • July 11, 2024
Avinash Wagh wrote:

because on my app interface i want show it as the sign of completion of that step

 

In that case you can get the recipient signature via the following API call:
https://developers.docusign.com/docs/esign-rest-api/reference/envelopes/envelopes/getrecipientsignature/


Forum|alt.badge.img+2
  • Author
  • New Voice
  • 7 replies
  • July 11, 2024

i already tried this api . and it returns

{

"signatureId": "21749d84-0a96-4c65-a7f9-b7d81ea9dd4a",

"signatureFont": "7_DocuSign",

"signatureType": "rubberstamp",

"signatureImageUri": "/envelopes/7f12cca6-b052-4db1-b301-3a3d28ac318b/recipients/1/signature_image",

"signatureInitials": "AK",

"initialsImageUri": "/envelopes/7f12cca6-b052-4db1-b301-3a3d28ac318b/recipients/1/initials_image",

"signature150ImageId": "aa128248-74ae-4136-b7f0-a66734f764d2",

"initials150ImageId": "b56091a6-bef3-4ffa-93de-3e792d5b7e9b",

"signatureName": "Aman Kazi",

"createdDateTime": "2024-07-09T06:40:11.6400000Z",

"adoptedDateTime": "2024-07-09T06:40:11.6570000Z"

}

does not returns any base64 or image/pdf. just uri how to call those uri

 


Forum|alt.badge.img+2
  • Author
  • New Voice
  • 7 replies
  • July 11, 2024

in return of signatureImage api it returns
 

<!DOCTYPE html>

<html lang="en" class="account-server">

<head>

<meta charset="utf-8">

<meta name="viewport" content="initial-scale=1.0">

<title>DocuSign</title>

<link rel="icon"

href="https://docucdn-a.akamaihd.net/olive/images/2.64.0/global-assets/ds-icons-favicon-default-64x64.svg"

type="image/svg+xml">

<link rel="canonical" href="https://account-d.docusign.com/" />

<base href="/">

<script type="text/javascript" nonce="zl12y/Ipvcpy7d4vcyYB/erFwmjRf0ziAx6wCkol4zA=">

window.__KAZMON_CONFIG__ = {

buildVersion: "24.2.200.18802",

environment: "DEMO",

instrumentationKey: "88d193ed-7206-4e34-975a-193a4fd08e36"

};

window.__NEW_ROOT_API__ = "True";

var FixtureHelper = {};

</script>

<!-- 24.2.200.18802 DA1DFE179 1a6364af-894e-4516-b1f7-3c54e6eb6c53 -->

</head>

<body class="site-content">

<noscript>You need to enable JavaScript to run this app.</noscript>

<div id="root"></div>

<form name="fixtureForm">

<input id="fixtureInput" type="hidden" value="{&amp;quot;settings&amp;quot;:{&amp;quot;traceToken&amp;quot;:&amp;quot;1a6364af-894e-4516-b1f7-3c54e6eb6c53&amp;quot;,&amp;quot;siteRoot&amp;quot;:&amp;quot;https://account-d.docusign.com/&amp;quot;,&amp;quot;forgotPasswordUri&amp;quot;:&amp;quot;https://account-d.docusign.com/forgotpassword&amp;quot;,&amp;quot;flowSubmissionUris&amp;quot;:{&amp;quot;oAuth&amp;quot;:&amp;quot;/oauth/auth&amp;quot;,&amp;quot;sso&amp;quot;:&amp;quot;/saml2/login/sp&amp;quot;,&amp;quot;username&amp;quot;:&amp;quot;/username&amp;quot;,&amp;quot;password&amp;quot;:&amp;quot;/password&amp;quot;,&amp;quot;web&amp;quot;:&amp;quot;/web/login&amp;quot;,&amp;quot;signUp&amp;quot;:&amp;quot;/signup&amp;quot;,&amp;quot;securityKeyLogin&amp;quot;:&amp;quot;/securitykeylogin&amp;quot;,&amp;quot;resourceCredentialSecurityKeyCreation&amp;quot;:&amp;quot;/resources/v1/manage/security-key/create&amp;quot;,&amp;quot;resourceCredentialSecurityKeyLogin&amp;quot;:&amp;quot;/resources/v1/manage/security-key/login&amp;quot;},&amp;quot;allowGetBrowserFingerprint&amp;quot;:true,&amp;quot;allowNewI18Library&amp;quot;:true,&amp;quot;renderInkLoginApp&amp;quot;:true,&amp;quot;assetPreloaderUrl&amp;quot;:null,&amp;quot;pseudoLocalizationEnabled&amp;quot;:false,&amp;quot;rebrandingEnabled&amp;quot;:true},&amp;quot;stateData&amp;quot;:{&amp;quot;state&amp;quot;:&amp;quot;username&amp;quot;,&amp;quot;oAuthLoginHintQS&amp;quot;:null,&amp;quot;oAuthLoginHintCookie&amp;quot;:null,&amp;quot;usernamePostAction&amp;quot;:null,&amp;quot;logoBytes&amp;quot;:null,&amp;quot;data&amp;quot;:null},&amp;quot;error&amp;quot;:null}" />

<input name="__RequestVerificationToken" type="hidden" value="AUwqVP9wPY8N5dPAE6eT2DcAAAAA0" />

</form>

</body>

<script src="/ReactApp/src/vendor/html-domparser.js"></script>

<script src="/ReactApp/dist/bundle.js?version=24.2.200.18802"></script>

</html>
how to consume it to load the file


Michael.Rave
Docusign Employee
Forum|alt.badge.img+14
  • Docusign Employee
  • 927 replies
  • July 11, 2024

The signature image API call is described here and should return the image:

https://developers.docusign.com/docs/esign-rest-api/reference/envelopes/envelopes/getrecipientsignatureimage/


Forum|alt.badge.img+2
  • Author
  • New Voice
  • 7 replies
  • July 11, 2024

for this api I’m getting response in stream of byte.

challenge is that how to convert it to useful format so i can render it to ui ?

implementation of sdk at service level is as bellow.
// js file --->
const envelopesApi = new EnvelopesApi(this.apiClient);
const response = await envelopesApi.getRecipientSignatureImage(dsConfig.accountId, envelopeId, '1');
return response
---/


Forum|alt.badge.img+2
  • Author
  • New Voice
  • 7 replies
  • July 11, 2024

Forum|alt.badge.img+3
  • New Voice
  • 12 replies
  • November 6, 2024

Hi @Avinash Wagh, were you able to achieve your requirement ?

I’m getting the same response & imageBase64 attribute is missing from the response. I believe it is because the signatureType attribute is “rubberstamp”.

I’ve a same requirement. Could you please help ?

Regards,

Mehul Shah