Laman Utama / Pusat Blog / DocuSign API: Mencipta Dokumen HTML "Responsif" untuk Tandatangan Mudah Alih

DocuSign API: Mencipta Dokumen HTML "Responsif" untuk Tandatangan Mudah Alih

Shunfang
2026-03-07
3min
Twitter Facebook Linkedin

Pengenalan API DocuSign untuk Tandatangan Mudah Alih

Dalam landskap protokol digital yang sentiasa berkembang, perniagaan semakin bergantung pada platform tandatangan elektronik untuk menyelaraskan aliran kerja, terutamanya pada peranti mudah alih di mana pengguna menjangkakan pengalaman yang lancar. API DocuSign menonjol sebagai alat yang berkuasa, membolehkan pembangun menyepadukan fungsi tandatangan responsif ke dalam aplikasi. Pendekatan ini bukan sahaja meningkatkan penglibatan pengguna tetapi juga memastikan pematuhan kepada piawaian global, menjadikannya pilihan strategik untuk perniagaan yang mengendalikan transaksi volum tinggi.

image


Membandingkan platform tandatangan elektronik dengan DocuSign atau Adobe Sign?

eSignGlobal menawarkan penyelesaian tandatangan elektronik yang lebih fleksibel dan kos efektif dengan pematuhan global, harga yang telus dan proses pendaftaran yang lebih pantas.

👉 Mulakan Percubaan Percuma


Mencipta Dokumen HTML Responsif dengan API DocuSign

Dari sudut pandang perniagaan, mengoptimumkan tandatangan elektronik untuk peranti mudah alih adalah penting, kerana laporan industri menunjukkan bahawa lebih daripada 50% perjanjian kini ditandatangani pada telefon pintar. API DocuSign membolehkan pembangun mencipta dokumen HTML "responsif" yang menyesuaikan diri dengan pelbagai saiz skrin, memastikan proses tandatangan yang lancar. Ini bukan sahaja mengurangkan kadar keciciran tetapi juga meningkatkan kecekapan operasi untuk pasukan jualan, HR dan undang-undang.

Panduan Langkah demi Langkah untuk Membina HTML Responsif untuk Tandatangan Mudah Alih

Untuk bermula, anda memerlukan akaun pembangun DocuSign dan kebiasaan dengan REST API mereka. Proses ini melibatkan pembenaman upacara tandatangan ke dalam sampul surat HTML yang responsif menggunakan pertanyaan media CSS. Berikut ialah cara melaksanakannya:

  1. Sediakan Sampul Surat DocuSign Anda Melalui API: Mulakan dengan mengesahkan dengan OAuth 2.0. Gunakan titik akhir Envelopes: create untuk menjana sampul surat. Tentukan dokumen sebagai fail HTML dengan menetapkan parameter documentBase64 kepada kandungan HTML berkod anda. Untuk pengoptimuman mudah alih, pastikan HTML termasuk teg meta viewport seperti <meta name="viewport" content="width=device-width, initial-scale=1.0"> untuk mengawal penskalaan.

    Contoh panggilan API (menggunakan cURL untuk ilustrasi):

    curl -X POST https://demo.docusign.net/restapi/v2.1/accounts/{accountId}/envelopes \
    -H "Authorization: Bearer {accessToken}" \
    -H "Content-Type: application/json" \
    -d '{
      "emailSubject": "Sign this document on mobile",
      "documents": [{
        "documentBase64": "{base64EncodedHTML}",
        "name": "responsive-agreement.html",
        "fileExtension": "html",
        "documentId": "1"
      }],
      "recipients": {
        "signers": [{
          "email": "signer@example.com",
          "name": "John Doe",
          "recipientId": "1",
          "tabs": {
            "signHereTabs": [{
              "xPosition": "100",
              "yPosition": "100",
              "documentId": "1",
              "pageNumber": "1"
            }]
          }
        }]
      },
      "status": "sent"
    }'
    

    Ini mencipta sampul surat yang mengandungi dokumen HTML, sedia untuk ditandatangani.

  2. Reka Bentuk Struktur HTML Responsif: Buat HTML anda menggunakan reka bentuk mudah alih dahulu. Gunakan susun atur fleksibel seperti Flexbox atau CSS Grid. Contohnya, strukturkan dokumen anda ke dalam bahagian untuk teks, medan dan kawasan tandatangan yang boleh mengalir semula pada skrin yang lebih kecil. Gabungkan teg sauh DocuSign atau teg teks untuk penempatan medan dinamik—contohnya, {{SigHere1}} untuk medan tandatangan.

    Contoh coretan HTML responsif:

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <style>
        body { font-family: Arial, sans-serif; margin: 0; padding: 20px; }
        .container { max-width: 100%; margin: 0 auto; }
        @media (max-width: 768px) {
          body { padding: 10px; }
          .signature-field { width: 100%; height: 100px; border: 1px dashed #ccc; }
        }
        @media (min-width: 769px) {
          .signature-field { width: 300px; height: 150px; }
        }
      </style>
    </head>
    <body>
      <div class="container">
        <h1>Agreement Terms</h1>
        <p>This is a responsive clause that adapts to your device.</p>
        <!-- DocuSign tabs will overlay here -->
      </div>
    </body>
    </html>
    

    Kodkan HTML ini ke Base64 sebelum menyerahkannya kepada API. CSS responsif memastikan medan seperti tandatangan berskala dengan betul, mengelakkan isu zum pada peranti mudah alih.

  3. Benamkan Upacara Tandatangan: Untuk tandatangan terbenam, gunakan titik akhir Rooms: create atau Envelopes: createRecipientView untuk menjana URL tandatangan. Halakan semula pengguna ke URL ini dalam apl anda. Untuk pengalaman pengguna mudah alih yang dipertingkatkan, jika SDK DocuSign menyokongnya, bersepadu JavaScript untuk interaksi mesra sentuhan seperti tandatangan leret.

    Selepas penciptaan, dapatkan semula paparan penerima:

    curl -X POST https://demo.docusign.net/restapi/v2.1/accounts/{accountId}/envelopes/{envelopeId}/views/recipient \
    -H "Authorization: Bearer {accessToken}" \
    -H "Content-Type: application/json" \
    -d '{
      "authenticationMethod": "none",
      "email": "signer@example.com",
      "returnUrl": "https://yourapp.com/return",
      "userId": "signer@example.com"
    }'
    

    url yang dikembalikan dioptimumkan untuk mudah alih secara lalai, tetapi reka bentuk responsif HTML anda memastikan dokumen itu sendiri dipaparkan dengan sempurna.

  4. Tangani Cabaran Khusus Mudah Alih: Uji pada peranti iOS dan Android. Isu biasa termasuk pemaparan fon dan sasaran sentuhan—kawasan sentuhan hendaklah sekurang-kurangnya 44x44 piksel mengikut garis panduan Apple. Jika HTML tersuai terlalu kompleks, gunakan PowerForms DocuSign untuk templat responsif yang telah dibina. Pantau status sampul surat melalui Webhooks untuk menjejaki kadar penyelesaian mudah alih, memaklumkan keputusan perniagaan.

  5. Amalan Terbaik untuk Integrasi Perniagaan: Dari sudut pandang komersial, persediaan ini sesuai untuk kes penggunaan volum tinggi seperti jualan lapangan. Hadkan kepada pelan yang menyokong kuota API (contohnya, Pertengahan sekitar 100 sampul surat sebulan). Pastikan pematuhan dengan menambahkan kod akses atau pengesahan SMS sebagai ciri tambahan.

Menurut kajian kes DocuSign, pendekatan yang didorong oleh API ini boleh mengurangkan masa tandatangan sehingga 80%, menjadikannya pelaburan yang berbaloi untuk perniagaan yang berpusatkan mudah alih. Pembangun harus merujuk kepada dokumentasi API DocuSign rasmi untuk kemas kini, kerana fungsi sentiasa berkembang.

Gambaran Keseluruhan IAM CLM dan Ekosistem DocuSign

Penyelesaian Pengurusan Perjanjian Pintar (IAM) dan Pengurusan Kitaran Hayat Kontrak (CLM) DocuSign melangkaui tandatangan elektronik asas, menawarkan automasi kontrak hujung ke hujung. IAM menyepadukan AI untuk penilaian risiko dan pengekstrakan klausa, manakala CLM mengendalikan draf, rundingan dan analisis. Alat ini adalah sebahagian daripada pelan peringkat lebih tinggi seperti Business Pro ($40/bulan/pengguna setiap tahun), menarik minat perusahaan yang memerlukan tadbir urus. IAM perusahaan penuh tidak mempunyai harga awam, tetapi ia adalah penyelesaian tersuai untuk industri yang intensif pematuhan.

image

Landskap Persaingan: Perbandingan Platform Tandatangan Elektronik

Dalam pasaran tandatangan elektronik global bernilai lebih $10 bilion, platform seperti DocuSign bersaing dari segi ciri, harga dan penyesuaian serantau. Berikut ialah perbandingan neutral pemain utama, memfokuskan pada aspek teras untuk penilaian perniagaan.

Platform Harga (Tahunan, USD) Had Pengguna Had Sampul Surat Ciri Utama Sokongan API Kekuatan Serantau
DocuSign Peribadi: $120; Standard: $300/pengguna; Business Pro: $480/pengguna; API Starter: $600 Lesen berasaskan tempat duduk ~100/pengguna/tahun (Standard/Pro) Penghantaran pukal, logik bersyarat, IAM CLM, SSO Teguh (pelan berasingan) Global, pematuhan AS/EU yang kukuh (ESIGN/eIDAS)
Adobe Sign Bermula pada $10/pengguna/bulan (dibilkan setiap tahun) Berasaskan tempat duduk Tanpa had pada peringkat yang lebih tinggi Integrasi ekosistem Adobe, borang, pembayaran Teguh melalui Adobe API Cemerlang dalam aliran kerja kreatif/digital, fokus AS/EU
eSignGlobal Essential: $299 (pengguna tanpa had); Professional: Tersuai Pengguna tanpa had 100 sampul surat (Essential) AI-Hub, penghantaran pukal, integrasi ID serantau (iAM Smart, Singpass) Termasuk dalam pelan Pro Dioptimumkan APAC, pematuhan global 100+ negara
HelloSign (Dropbox Sign) Peringkat percuma; Pro: $15/pengguna/bulan Berasaskan tempat duduk 20/bulan (Pro) UI ringkas, templat, kerjasama pasukan API asas Mesra pengguna SMB, berpusat di AS, integrasi mudah dengan Dropbox

Jadual ini menyerlahkan pertukaran: DocuSign cemerlang dalam kedalaman perusahaan, manakala alternatif mengutamakan kos atau penyesuaian serantau.

Adobe Sign: Pilihan Perusahaan yang Seimbang

Adobe Sign, yang disepadukan dengan lancar dengan alat PDF dan suite perusahaan seperti Microsoft 365, menawarkan tandatangan mudah alih yang mantap dengan borang responsif. Harga bermula rendah tetapi meningkat dengan ciri tambahan seperti pengesahan identiti. Ia sesuai untuk industri intensif dokumen, menekankan keselamatan di bawah rangka kerja ESIGN dan eIDAS.

image

eSignGlobal: Fokus Pematuhan Serantau

eSignGlobal memposisikan dirinya sebagai alternatif kos efektif dengan pematuhan di lebih 100 negara arus perdana di seluruh dunia, terutamanya mempunyai kelebihan di rantau Asia Pasifik (APAC). Landskap tandatangan elektronik APAC berpecah-belah, dengan piawaian tinggi dan peraturan yang ketat yang memerlukan penyelesaian integrasi ekosistem—berbeza dengan ESIGN/eIDAS yang lebih berasaskan rangka kerja di AS dan EU. Di sini, platform mesti mencapai integrasi perkakasan/API peringkat mendalam dengan identiti digital kerajaan kepada perniagaan (G2B), halangan teknikal yang jauh melampaui pengesahan e-mel atau corak pengisytiharan kendiri yang biasa dilihat di pasaran Barat. Pelan Essential eSignGlobal, hanya pada $16.6/bulan (tahunan), membenarkan sehingga 100 dokumen tandatangan elektronik dihantar, tempat duduk pengguna tanpa had dan pengesahan kod akses, memberikan nilai yang kukuh berdasarkan pematuhan. Ia disepadukan dengan lancar dengan iAM Smart Hong Kong dan Singpass Singapura, mengurangkan kependaman dan meningkatkan kepercayaan untuk transaksi rentas sempadan.

esignglobal HK


Mencari alternatif yang lebih pintar daripada DocuSign?

eSignGlobal menawarkan penyelesaian tandatangan elektronik yang lebih fleksibel dan kos efektif dengan pematuhan global, harga yang telus dan proses pendaftaran yang lebih pantas.

👉 Mulakan Percubaan Percuma


HelloSign (Dropbox Sign): Kesederhanaan untuk SMB

HelloSign, kini sebahagian daripada Dropbox, menawarkan antara muka intuitif untuk persediaan pantas, memberikan sokongan mudah alih yang kukuh melalui pembenaman responsif. Ia kos efektif untuk pasukan kecil, tetapi kekurangan kedalaman API lanjutan berbanding dengan DocuSign, memfokuskan pada kemudahan penggunaan dan bukannya penyesuaian.

Peraturan Tandatangan Elektronik Serantau

Walaupun tajuk tidak menyatakan rantau, memahami undang-undang adalah penting untuk pelaksanaan API. Di AS, ESIGN dan UETA menyediakan kebolehkuatkuasaan yang meluas untuk rekod elektronik. eIDAS EU mengawal selia tandatangan yang berkelayakan untuk kesan undang-undang yang lebih tinggi. APAC berbeza-beza: Akta Transaksi Elektronik Singapura menyerupai ESIGN tetapi memerlukan kediaman data tempatan, manakala Hong Kong memerlukan integrasi dengan sistem seperti iAM Smart untuk memastikan kesahihan. Perniagaan yang menggunakan API DocuSign mesti mengkonfigurasi sampul surat dengan sewajarnya untuk mengelakkan perangkap pematuhan.

Kesimpulan

API DocuSign memperkasakan tandatangan mudah alih responsif, memacu kecekapan dalam dunia yang mengutamakan digital. Untuk alternatif, pertimbangkan eSignGlobal sebagai pilihan pematuhan serantau, terutamanya di APAC, mengimbangi kos dan liputan global. Nilaikan berdasarkan keperluan perniagaan anda untuk mencari padanan yang terbaik.

avatar
Shunfang
Ketua Pengurusan Produk di eSignGlobal, seorang pemimpin berpengalaman dengan pengalaman antarabangsa yang luas dalam industri tandatangan elektronik. Ikuti LinkedIn saya