Using In-app Signing

How it works

In-app signing allows you to host a signing page within your application.
This works by hosting an iframe in your application, where the signing page will be rendered.

Step 1: Create a document that you want signed and assign the relevant signer details (e.g. name and email address)
Step 2: Using the api, get the signatory_uuid for the signers that must sign in app.
Step 3: Call /document_packs/<document_key>/generate_in_app_signing_url/<signatory_uuid>?signing_page_url=. to generate a signing_url for that signer.
Step 4: Render the url that is returned in an iframe on your page.

Generating In-app signing url

GET /documents/<document_key>/generate_in_app_signing_url/<signatory_uuid>

query string parameters:

signer_is_validated default is false. When it is false, there'll be a post sign validation OTP that will be need to be entered after signing the document. When it is true, no post sign validation is performed. Apps that would like to use this functionality need to be pre-approved in order to do so. Please contact [email protected] to get validated.
signing_page_url This is the url where the iframe will be hosted in your app. It's important that this is set otherwise you'll end up with no signing page being returned. NB: the signing page url must be urlencoded. The signing_page_url can be specified on the document instead as in_app_page_url.
is_in_person if set to true, it indicates that this request is being signed in person. The user interface will require the user to tick/check the box indicating that the document was signed in each other's presence.

GET /v1/document_pack/ahFzfnF1aWNrbHlzaWduLWRldnIkCxIIRG9jdW1lbnQiFnB3TmRlUzF3eUJNbE40Qmk2Ymd3QlYM/generate_in_app_signing_url/68a20901-cc87-4160-ddbb-9d0c48b4ad90?signer_is_validated=true&amp; signing_page_url=http%3A%2F%2Flocalhost%3A8484&amp; access_token=<access_token> HTTP/1.1
Host: dev.quicklysign.com
Content-Type: application/json
cache-control: no-cache

curl -X GET \
  'https://dev.quicklysign.com/v0/documents/ahFzfnF1aWNrbHlzaWduLWRldnIkCxIIRG9jdW1lbnQiFnB3TmRlUzF3eUJNbE40Qmk2Ymd3QlYM/generate_in_app_signing_url/68a20901-cc87-4160-ddbb-9d0c48b4ad90?signer_is_validated=true&signing_page_url=http%3A%2F%2Flocalhost%3A8484&access_token=<access_token>' \
  -H 'Content-Type: application/json' \
  -H 'Postman-Token: 9f1f9dc6-4eba-4d93-972a-4eba3e1bc096' \
  -H 'cache-control: no-cache'

{
    "data": {
        "signing_link": "https://dev.quicklysign.com/sign?token=5f2FUZ4q4VhD58JuTVShjpRVwsLeulS3kJCDg0Pg7bl"
    },
    "status": {
        "information": "This signing link can only be used for domain http://localhost:8484. Signer is pre-validated. ",
        "status_code": 200
    }
}

Using the signing url in your application - client side

We provide a javascript widget which will insert an iframe into your page for a given container.
If no container is specified, then the widget will automatically append a container to the body.

<script src="https://dev.quicklysign.com/public/widgets/embed.widget.latest.min.js"></script>
<div id="container"></div>

<script>
    QuicklySign.init("<your client id>");
    QuicklySign.open({
                  url:"<your signing url>",
                  container_id:"container",
      						message_listener:function(event_data){if(event_data.event === Quicklysign.EVENTS.SIGNED){
                  alert("document signed");
                  },
                   post_sign_url:""
});</script>

Parameters to use with Quicklysign.open()

Parameter name	Data
url (optional)	signing url to be used. If not specified, the widget will look in the host page url for query parameter "qs_url".
container_id (optional)	The id of the div that will be used to contain the iframe
message_listener (optional)	function to callback when signing completes or is deferred.
post_sign_url (optional)	A page to redirect to after the user has signed the document. Use this OR message_listener

Message listener function will receive an object with event property.
The list of possible events is as follows:

Event
Quicklysign.EVENTS.SIGNED	This indicates that the document was signed.
Quicklysign.EVENTS.SIGN_LATER	This indicates that the user has opted to sign later.