Bat CKEditor ปลั๊กอินอัพโหลดรูปภาพอัตโนมัติ v1.0

ปลั๊กอินนี้ได้รับการพัฒนาโดยใช้เทคโนโลยี JAVA และจำเป็นต้องใช้ร่วมกับ JavaScript โดยปลั๊กอินนี้สามารถอัปโหลดรูปภาพในเครื่องได้โดยอัตโนมัติ (src คือ 'file:///') ที่มีอยู่ในหน้าเว็บไปยังเซิร์ฟเวอร์ และแก้ไขแอตทริบิวต์ src ของ img แท็กไปยังที่อยู่รูปภาพใหม่ สถานการณ์การใช้งานทั่วไป ได้แก่: การใช้มันกับ ckEditor เพื่ออัพโหลดรูปภาพในเครื่องที่มีอยู่ในเนื้อหาที่วางจาก WORD ไปยังเซิร์ฟเวอร์โดยอัตโนมัติ

สภาพแวดล้อมที่ขึ้นอยู่กับ: JDK1.7+, jQuery, ckEditor4.2 ไม่จำกัดเบราว์เซอร์

คำแนะนำทั่วไปสำหรับการใช้งาน

จาวาสคริปต์ API:

ใจดี

WordImageUploader(s_url, app_name)

s_url: ที่อยู่หน้าเซิร์ฟเวอร์สำหรับการอัพโหลดรูปภาพ ซึ่งเป็นหน้าไดนามิก เช่น servlet, PHP ฯลฯ

app_name: ชื่อของแอปพลิเคชันปัจจุบัน

ก่อนที่จะใช้ปลั๊กอินนี้ คุณต้องสร้างออบเจ็กต์ของคลาสนี้ก่อน วิธีที่ดีที่สุดคือมีออบเจ็กต์เดียวของคลาสนี้ในหนึ่งเพจ

var uploader = ใหม่ WordImageUploader(sUrl,appName);

วิธีการของคลาสนี้คือ

uploadWordImagesFromCKEditor (ตัวแก้ไข, pre_id)

วิธีการนี้ใช้เพื่ออัปโหลดรูปภาพในเครื่องทั้งหมดในข้อความที่วางจาก WORD ใน CKEditor ไปยังเซิร์ฟเวอร์ ความหมายของพารามิเตอร์มีดังนี้

editorInstance: อินสแตนซ์ของ CKEditor;

pre_id: คำนำหน้าชื่อหลังจากอัพโหลดรูปภาพไปยังเซิร์ฟเวอร์ เพื่ออำนวยความสะดวกในการทำความสะอาดและบำรุงรักษาอื่นๆ ในอนาคต หากไม่จำเป็น ให้ตั้งค่าเป็น '';

uploadLocalFile (localUrl, ชื่อ)

วิธีการนี้ใช้เพื่ออัปโหลดรูปภาพในเครื่องเดียวไปยังเซิร์ฟเวอร์ ความหมายของพารามิเตอร์มีดังนี้:

localUrl: URL ในเครื่องของรูปภาพ โดยทั่วไปจะอยู่ในรูปแบบ: file:///xxx

ชื่อ: ชื่อของรูปภาพ

ขั้นตอนการใช้งาน

1. แนะนำไลบรารีคลาส jQuery

2. แนะนำ wordimage_uploader.js ในโฟลเดอร์ js

3. สร้างวัตถุ WordImageUploader;

4. เรียกใช้เมธอด uploadWordImagesFromCKEditor เมื่อเนื้อหาของ ckEditor เปลี่ยนแปลง

หลังจากติดตั้งปลั๊กอินแล้ว "Monitoring Station: ยินดีต้อนรับสู่การใช้ "Local Image Automatic Upload Plug-in" ควรแสดงในไฟล์สถานะของหน้าเว็บ

ปลั๊กอินนี้รองรับเทคโนโลยีเว็บไซต์แบบไดนามิกทั้งหมด เทคโนโลยีที่ใช้ใน DEMO คือ jsp หน้าไดนามิกที่ยอมรับไฟล์ที่อัปโหลดบนฝั่งเซิร์ฟเวอร์คือ Servelt: WordImageUploader.java โปรดดูไฟล์นี้เพื่อนำไปใช้ด้วยตนเอง

สำหรับรายละเอียดการใช้งานอื่นๆ โปรดดูที่ซอร์สโค้ด DEMO