วิธีเพิ่มการอัปโหลดไฟล์ให้แอปของคุณ

การเพิ่มการอัปโหลดไฟล์ให้แอป ให้เก็บไฟล์ในที่เก็บไฟล์ (object storage หรือ bucket) ไม่ใช่บนดิสก์ของเซิร์ฟเวอร์หรือในฐานข้อมูล และบันทึกระเบียนเล็ก ๆ ในฐานข้อมูลที่มีคีย์ ชื่อ ขนาด ชนิด และเจ้าของของไฟล์ ตรวจขนาดและชนิดของไฟล์ที่เซิร์ฟเวอร์ ตัดสินใจไว้ก่อนว่าไฟล์เป็นสาธารณะ (เช่น รูปสินค้า) หรือส่วนตัว (เช่น ใบแจ้งหนี้) และให้บริการไฟล์ส่วนตัวหลังจากตรวจแล้วว่าใครเป็นผู้ขอเท่านั้น ในเครื่องมือสร้างแอป AI คุณอธิบายฟีเจอร์อัปโหลดได้ในพรอมต์เดียว สิ่งสำคัญคือการทดสอบว่าไฟล์ยังอยู่หลัง redeploy และคนที่ไม่ควรเปิดไฟล์ไม่สามารถเปิดได้

ตัดสินใจก่อนว่าคุณต้องอัปโหลดแบบไหน

ก่อนสร้าง ให้ตอบคำถามสามข้อ:

1. ไฟล์อะไร? รูปโปรไฟล์ รูปสินค้า PDF สเปรดชีต เสียง วิดีโอ ข้อนี้กำหนดขีดจำกัดชนิดและขนาด
2. ใครเห็นได้บ้าง? ทุกคน (แกลเลอรีสาธารณะ) หรือเฉพาะผู้อัปโหลดและแอดมิน (สัญญา เอกสารยืนยันตัวตน ไฟล์ลูกค้า)
3. หลังอัปโหลดเกิดอะไรขึ้น? เก็บไว้เฉย ๆ แสดงตัวอย่าง ปรับขนาดรูป หรืออ่านเนื้อหา

รูปสาธารณะกับเอกสารส่วนตัวต้องการการตั้งค่าต่างกัน จึงควรตกลงเรื่องนี้ก่อน

ไฟล์ควรอยู่ที่ไหน

สำหรับแอปส่วนใหญ่ คำตอบที่เหมาะคือ object storage บวกกับระเบียนในฐานข้อมูล แถวในฐานข้อมูลคือสิ่งที่แอปของคุณค้นหา ("แสดงเอกสารของผู้ใช้คนนี้") ส่วน bucket เก็บแค่ไบต์ของไฟล์

ไฟล์สาธารณะกับไฟล์ส่วนตัว

• ไฟล์สาธารณะ (รูปสินค้า รูปในบล็อก อวาตาร์) สามารถให้บริการจาก URL สาธารณะได้ ใครก็ตามที่มีลิงก์เปิดได้ ซึ่งใช้ได้สำหรับเนื้อหาประเภทนี้
• ไฟล์ส่วนตัว (ใบแจ้งหนี้ สัญญา เอกสารทางการแพทย์หรือยืนยันตัวตน งานส่งมอบให้ลูกค้า) ต้องไม่มี URL สาธารณะที่เดาได้ เซิร์ฟเวอร์ตรวจว่าผู้ใช้ที่ล็อกอินเป็นเจ้าของไฟล์หรือมีสิทธิ์ จากนั้นจึงส่งไฟล์กลับไป หรือคืน signed URL ซึ่งเป็นลิงก์ที่ใช้ได้เพียงระยะเวลาสั้น ๆ

บั๊กที่พบบ่อยและร้ายแรงคือการเก็บไฟล์ส่วนตัวไว้ใน bucket สาธารณะโดยใช้ชื่อที่เดาได้ ใครก็ตามที่เดาว่า /uploads/invoice-102.pdf จะได้ใบแจ้งหนี้ของคนอื่นไป

ตัวอย่างพรอมต์

การอัปโหลดรูปสาธารณะ:

ให้แอดมินอัปโหลดรูปสินค้าได้สูงสุด 5 รูปต่อสินค้า รับไฟล์ JPG, PNG และ WebP ขนาดไม่เกิน 5 MB ต่อไฟล์ เก็บไฟล์ในพื้นที่เก็บไฟล์ บันทึกคีย์ ขนาด และลำดับของแต่ละไฟล์ในตาราง product_images และแสดงภาพย่อพร้อมปุ่มลบ ตรวจชนิดและขนาดที่เซิร์ฟเวอร์ ไม่ใช่แค่ในเบราว์เซอร์

การอัปโหลดเอกสารส่วนตัว:

เพิ่มหน้า Documents สำหรับลูกค้าที่ล็อกอินแล้ว ลูกค้าอัปโหลด PDF ได้ไม่เกิน 20 MB ไฟล์เป็นส่วนตัว: เก็บในพื้นที่เก็บไฟล์ บันทึก owner ID ชื่อไฟล์เดิม ขนาด และเวลาที่อัปโหลดในตาราง documents และให้เฉพาะเจ้าของและแอดมินดาวน์โหลดได้ การดาวน์โหลดผ่านเส้นทางบนเซิร์ฟเวอร์ที่ตรวจสิทธิ์ ห้ามเปิดเผย URL สาธารณะสำหรับไฟล์เหล่านี้

ขั้นตอนต่อเนื่องที่มีประโยชน์:

แสดงแถบความคืบหน้าระหว่างอัปโหลด และแสดงข้อผิดพลาดที่ชัดเจนหากไฟล์ใหญ่เกินไปหรือชนิดไม่ถูกต้อง

เมื่อระเบียนเอกสารถูกลบ ให้ลบไฟล์ที่เก็บไว้ด้วย

ขั้นตอนทีละขั้น

1. เลือกชนิดและขีดจำกัดขนาด สำหรับแต่ละช่องอัปโหลด ให้เจาะจง: "PDF ไม่เกิน 20 MB" ไม่ใช่ "เอกสาร"
2. เปิดใช้พื้นที่เก็บไฟล์ ในเครื่องมือสร้างแอป AI ให้ขอฟีเจอร์อัปโหลด แล้วระบบจะตั้งค่าที่เก็บให้ ที่อื่นให้สร้าง bucket แล้วเพิ่มข้อมูลการเชื่อมต่อเป็นความลับฝั่งเซิร์ฟเวอร์
3. สร้างตารางในฐานข้อมูล สำหรับระเบียนไฟล์: ID เจ้าของ คีย์ในที่เก็บ ชื่อเดิม ชนิด ขนาด เวลาที่สร้าง
4. สร้างเส้นทางการอัปโหลด บนเซิร์ฟเวอร์: ตรวจว่าผู้ใช้ล็อกอินอยู่ ตรวจชนิดและขนาด สร้างคีย์ที่ปลอดภัยสำหรับการเก็บ (ไม่ใช่ชื่อไฟล์ของผู้ใช้) บันทึกไฟล์ แล้วเพิ่มระเบียน
5. สร้างเส้นทางดาวน์โหลดหรือแสดงผล: URL สาธารณะสำหรับไฟล์สาธารณะ เส้นทางที่ตรวจสิทธิ์หรือ signed URL สำหรับไฟล์ส่วนตัว
6. สร้าง UI: ตัวเลือกไฟล์ ลากและวางหากเหมาะสม ความคืบหน้า ตัวอย่าง และข้อผิดพลาด
7. จัดการการลบ เพื่อให้การลบระเบียนลบไฟล์ที่เก็บไว้ด้วย
8. ทดสอบ: อัปโหลด รีโหลด redeploy หรือเผยแพร่ แล้วตรวจว่าไฟล์ยังเปิดได้ จากนั้นล็อกอินด้วยผู้ใช้คนอื่นและลองเปิดไฟล์ส่วนตัวของผู้ใช้คนแรก

ข้อผิดพลาดที่พบบ่อย

• เขียนไฟล์อัปโหลดลงดิสก์ของเซิร์ฟเวอร์ ใช้ได้ในการพัฒนา แต่หลังรีสตาร์ทหรือ redeploy ไฟล์จะหายไป
• เชื่อการตรวจสอบของเบราว์เซอร์ การตั้งค่า "accept" ของช่องเลือกไฟล์เป็นคำแนะนำ ไม่ใช่ความปลอดภัย ตรวจชนิดและขนาดที่เซิร์ฟเวอร์
• ใช้ชื่อไฟล์ของผู้ใช้เป็นคีย์ในที่เก็บ ชื่อจะชนกันได้และอาจมีอักขระแปลก ๆ ให้สร้างคีย์ที่ไม่ซ้ำกันและเก็บชื่อเดิมแยกไว้
• ใช้ bucket สาธารณะกับไฟล์ส่วนตัว ดูด้านบน นี่คือเรื่องที่ทำให้เกิดข่าว
• อนุญาตทุกชนิดไฟล์ ไฟล์ HTML หรือ SVG ที่ให้บริการจากโดเมนของคุณอาจรันสคริปต์ได้ในบางการตั้งค่า รับเฉพาะชนิดที่จำเป็น
• ไม่มีขีดจำกัดขนาด การอัปโหลดไฟล์ใหญ่เพียงไฟล์เดียวอาจกินโควตาพื้นที่หรือทำให้คำขอหมดเวลา
• ไฟล์กำพร้า การลบแถวในฐานข้อมูลแต่ไม่ลบไฟล์ ทำให้พื้นที่ที่คุณจ่ายเงินค่อย ๆ เต็ม
• ลืมมือถือ รูปจากโทรศัพท์อาจมีขนาดใหญ่และเป็นรูปแบบเช่น HEIC ตัดสินใจว่าจะรับหรือแปลงไฟล์เหล่านี้

เช็กลิสต์

• ไฟล์ไปที่ object storage ไม่ใช่ดิสก์เซิร์ฟเวอร์หรือฐานข้อมูล
• ไฟล์แต่ละไฟล์มีระเบียนในฐานข้อมูลที่มีเจ้าของ คีย์ ชื่อ ชนิด และขนาด
• ตรวจชนิดและขนาดที่เซิร์ฟเวอร์
• คีย์ในที่เก็บถูกสร้างขึ้น ไม่ได้นำมาจากชื่อไฟล์
• ไฟล์ส่วนตัวให้บริการเฉพาะหลังตรวจสิทธิ์แล้ว
• ผู้ใช้อื่นเปิดไฟล์ส่วนตัวของคุณไม่ได้ แม้มีลิงก์
• การลบระเบียนลบไฟล์ด้วย
• ไฟล์ยังเปิดได้หลังเผยแพร่หรือ redeploy
• ข้อผิดพลาดการอัปโหลดแสดงชัดเจน รวมถึงบนโทรศัพท์

การอัปโหลดไฟล์ใน Mythex

Mythex สามารถเปิด พื้นที่เก็บไฟล์ ให้โปรเจกต์โดยอัตโนมัติเมื่อแอปของคุณต้องอัปโหลด ดังนั้นคุณไม่ต้องจัดเตรียม bucket ด้วยตนเอง คุณยังพิมพ์ /storage ในแชตได้ด้วย มีให้ใช้ในแพ็กเกจ Free และ Pro โดยแพ็กเกจ Free จำกัดที่ 1 GB และดูสถานะได้ที่ Settings → Storage

เอกสารระบุชัดเจนว่าการโฮสต์ที่เผยแพร่แล้วไม่ใช่ระบบไฟล์โลคัลที่คงทน ดังนั้นให้ขอให้เอเจนต์ใช้พื้นที่เก็บไฟล์ของแพลตฟอร์ม แทนการบันทึกลงดิสก์ ไฟล์ที่เก็บและการดาวน์โหลดจะถูกหักจากยอดเครดิตของคุณตามขนาดและปริมาณที่ดาวน์โหลด โดยแพ็กเกจ Pro จ่ายครึ่งหนึ่งของอัตรา Free ดู File storage ในเอกสาร

การอัปโหลดมักมาพร้อม ฐานข้อมูล สำหรับระเบียนไฟล์ และ ระบบล็อกอิน สำหรับไฟล์ส่วนตัว หากคุณกำลังสร้างพื้นที่ที่ลูกค้าแลกเปลี่ยนเอกสารกัน ดู วิธีสร้างพอร์ทัลลูกค้า และตรวจตาม เช็กลิสต์ความปลอดภัย ก่อนเปิดตัว

คำถาม