TutuDocs · คอมโพเนนต์ที่ฝังได้

โค้ดเพียงบรรทัดเดียว — เพิ่มโปรแกรมแก้ไขเอกสารลงในเว็บไซต์ของคุณได้ในไม่กี่วินาที

ฝังโปรแกรมแก้ไขเอกสาร TutuDocs (การจัดหน้า / ตาราง / รูปภาพ / เค้าโครง) ลงในเว็บไซต์ใดก็ได้ของคุณ ผู้เยี่ยมชมเขียนเอกสารได้บนเว็บไซต์ของคุณโดยตรง ปรับแต่งธีมได้ และการอัปเดตผลิตภัณฑ์มีผลโดยอัตโนมัติ — คุณไม่ต้องดูแลรักษาเลย

คัดลอกแล้ววาง — ก่อนแท็ก </body> ของหน้าเว็บคุณ
<script src="https://tutudocs.com/embed.js"
        data-key="pk_live_YOUR_KEY"
        data-mount="#tutudocs-editor" defer></script>

แทนที่ pk_live_YOUR_KEY ด้วยคีย์ที่คุณสร้างเองในคอนโซล (ผู้ใช้ที่ลงทะเบียนคนใดก็ได้ — ไม่ต้องตรวจสอบ มีผลทันที); คอนเทนเนอร์ #tutudocs-editor ต้องมีความกว้างและความสูง ลงทะเบียน URL ที่ฝังของคุณเมื่อตั้งค่า (รายการอนุญาต; สำหรับการพัฒนาในเครื่องให้ใส่ localhost); จะแสดงเฉพาะบนเว็บไซต์ที่คุณลงทะเบียนไว้เท่านั้น

ลองใช้งานจริง

คลิกปุ่มด้านล่างเพื่อลองใช้โปรแกรมแก้ไขเอกสารที่ฝังไว้ได้ที่นี่เลย

JS API (สำหรับ callback / การปรับแต่ง)

<script src="https://tutudocs.com/embed.js"></script>
<script>
  const editor = TutuDocs.mount('#tutudocs-editor', {
    key: 'pk_live_YOUR_KEY',
    theme: 'auto',            // auto | light | dark
    onSave: (file) => {
      // file.dataUrl = the exported Word document (.docx, base64)
      upload(file.dataUrl);
    }
  });
  // After the user clicks Done, onSave returns the .docx; or call it directly:
  // const { dataUrl } = await editor.export();
</script>

ตัวเลือกการกำหนดค่าทั้งหมด

พารามิเตอร์ชนิดคำอธิบาย
keystringคีย์สาธารณะ pk_ ของคุณ (สร้างในคอนโซล) จำเป็นต้องระบุ
theme'auto'|'light'|'dark'ธีม; auto จะปรับตามโหมดสว่าง/มืดของโฮสต์/ระบบ
saveTextstringข้อความปุ่ม «เสร็จสิ้น» (ค่าเริ่มต้น «เสร็จสิ้นและส่งกลับ», ≤16 อักขระ) แสดงในแถบบนแบบดั้งเดิมของโปรแกรมแก้ไข (ข้างๆ แชร์/ประวัติ)
hideSuitebooleanซ่อนตัวเปิดชุดโปรแกรม (ซ่อนโดยค่าเริ่มต้นเมื่อฝัง เพื่อลดการรบกวน)

เมท็อด

  • editor.export()ส่งออกเอกสารปัจจุบันเป็น .docx → Promise<{dataUrl,mime,size}>
  • editor.setTheme('dark')สลับธีมขณะทำงาน
  • editor.destroy()ถอดคอมโพเนนต์ (ลบ iframe)

callback ของเหตุการณ์

  • onReady()โปรแกรมแก้ไขพร้อมแล้ว
  • onSave(file)ผู้ใช้คลิก «เสร็จสิ้น» → file.dataUrl คือเอกสาร Word ที่ส่งออก (.docx)
  • onError(e)e.message เป็นภาษาที่เข้าใจง่าย (ไม่ได้เปิดใช้งาน / ไม่มีสิทธิ์ / โหลดไม่สำเร็จ)
  • onClose()เลเยอร์ลอยแบบเต็มจอถูกปิดแล้ว

ความปลอดภัย · อัปเดตอัตโนมัติ

  • · บริการตนเอง อนุมัติอัตโนมัติ: ผู้ใช้ที่ลงทะเบียนคนใดก็ได้ลงทะเบียนชื่อเว็บไซต์ + URL ที่ฝังในคอนโซล แล้วได้คีย์ที่ใช้งานได้ทันที
  • · คีย์เป็นสาธารณะ; ป้องกันการนำไปใช้ในทางที่ผิดด้วยรายการอนุญาต/ปฏิเสธของ URL ที่ลงทะเบียน (รายการปฏิเสธมาก่อน) โดเมนที่ไม่ได้ลงทะเบียนจะถูกปฏิเสธพร้อมข้อความให้ลงทะเบียน; คุณหยุดชั่วคราวหรือกลับมาใช้งานได้ทุกเมื่อ
  • · สถิติแหล่งที่มาจริง: การโหลดแต่ละครั้งนับตาม Origin (รวมที่ถูกบล็อกด้วย); คอนโซลแสดงรายละเอียดแยกตามแหล่งที่มา และคุณเพิ่มโดเมนที่ไม่ได้ลงทะเบียนเข้ารายการอนุญาตได้ด้วยคลิกเดียว
  • · โปรแกรมแก้ไขทำงานบนโดเมนของ TutuDocs เอง (แยกอิสระ); หน้าเว็บของคุณเข้าถึงข้อมูลรับรองใดๆ ของ TutuDocs ไม่ได้ และเอกสารส่วนตัวของ TutuDocs ของผู้เยี่ยมชมจะไม่ปรากฏในคอมโพเนนต์ที่ฝังไว้เลย
  • · คอมโพเนนต์โฮสต์เองและอัปเดตอัตโนมัติโดย TutuDocs — การอัปเกรดฟีเจอร์ไม่ต้องแก้โค้ดฝั่งคุณ; ไม่ต้องดูแลรักษาเลย