บน Cloudflare Pages คุณไม่สามารถเปิดดูหรือดาวน์โหลดไฟล์ทั้งหมด (เช่น โค้ด HTML, CSS, JavaScript) ที่อัปโหลดไปแล้วกลับมาเป็นโฟลเดอร์ผ่านหน้า Dashboard ได้โดยตรง
อย่างไรก็ตาม คุณสามารถจัดการและตรวจสอบไฟล์ได้จากช่องทางเหล่านี้ ขึ้นอยู่กับวิธีที่คุณใช้ Deploy:
- กรณีเชื่อมต่อผ่าน Git (GitHub / GitLab):
- ไฟล์ต้นฉบับทั้งหมดจะอยู่บน Repository ของคุณบน GitHub หรือ GitLab ไม่ได้เก็บแก้ไขโดยตรงใน Cloudflare
- หากต้องการแก้ไฟล์ ให้แก้ที่ต้นทางใน GitHub/GitLab แล้ว Push ระบบจะ Deploy ให้ใหม่อัตโนมัติ
- กรณีใช้ Direct Upload (อัปโหลดผ่านโฟลเดอร์/ไฟล์ Zip):
- Cloudflare จะเก็บไฟล์ชุดนั้นไว้สำหรับรันเว็บไซต์ แต่ไม่มีฟังก์ชันให้กด “Browse” หรือดาวน์โหลดไฟล์แยกชิ้น/ทั้งหมดกลับมาได้
- วิธีแก้คือคุณต้องเก็บไฟล์ต้นฉบับไว้ในเครื่องคอมพิวเตอร์ของคุณเอง และทำการอัปโหลด (Drag and drop หรือใช้ Wrangler CLI) ทับใหม่อีกครั้งเมื่อต้องการแก้ไข
- กรณีต้องการดู Log หรือฟังก์ชัน (Functions):
- เข้าไปที่ Cloudflare Dashboard
- ไปที่เมนู Workers & Pages -> เลือกโปรเจกต์ Pages ของคุณ -> ไปที่แท็บ Deployments เพื่อดูประวัติการ Build หรือดูไฟล์ Functions ได้บางส่วน
หากคุณกำลังมองหาไฟล์ไหนอยู่ หรือ Deploy ผ่านวิธีใด (Git หรือ Direct Upload) ลองบอกเพิ่มเติมได้ครับ จะช่วยแนะนำวิธีจัดการให้ครับ
ถ้าหากมีอัพไฟล์สำคัญผิดละ จะลบยังไง?
หากคุณอัปโหลดไฟล์สำคัญผิดขึ้นไป (เช่น ไฟล์รหัสผ่าน, .env, หรือข้อมูลส่วนตัว) ให้ทำตามวิธีด้านล่างนี้ทันที เพื่อลบไฟล์นั้นออกจากระบบครับ
1. ลบ Deployment ที่ผิดพลาดทิ้ง (วิธีที่เร็วที่สุด)
เนื่องจาก Cloudflare Pages ทำงานเป็นระบบ Versioning (แยกตามการอัปโหลดแต่ละรอบ) วิธีที่ปลอดภัยที่สุดคือการไปลบรอบการ Deploy (Deployment) นั้นออกครับ:
- เข้าไปที่ Cloudflare Dashboard > Workers & Pages > เลือกโปรเจกต์ของคุณ
- คลิกแท็บ Deployments
- หาตัว Deployment ล่าสุดที่มีไฟล์ผิดพลาด
- คลิกที่ปุ่ม จุดสามจุด (
...) ด้านขวาของ Deployment นั้น แล้วเลือก Delete เพื่อทำลายไฟล์ในรอบนั้นทิ้งทันที
2. แก้ไขไฟล์และ Deploy ทับใหม่ (Roll Forward)
การแก้ไฟล์แล้วสั่ง Build ใหม่ จะช่วยอัปเดตหน้าเว็บปัจจุบันให้ปลอดภัย
- หากใช้ Git (GitHub/GitLab):
- ลบไฟล์สำคัญนั้นออกจากโฟลเดอร์ในเครื่องคอมพิวเตอร์ของคุณ
- ทำการ
git commitและgit pushขึ้นไปใหม่ - ข้อควรระวัง: แม้หน้าเว็บปัจจุบันจะอัปเดตแล้ว แต่ไฟล์สำคัญอาจยังคงค้างอยู่ในประวัติ (Git History) ของ GitHub/GitLab คุณจำเป็นต้องไปลบ Commit History ใน Git หรือตั้งค่า Repository ให้เป็น Private เพื่อความปลอดภัย
- หากใช้ Direct Upload:
- ลบไฟล์สำคัญนั้นออกจากโฟลเดอร์ในเครื่องคอมพิวเตอร์
- ลากโฟลเดอร์ที่แก้ไขแล้ว อัปโหลดทับขึ้นไปใหม่ที่หน้า Dashboard หรือใช้ Wrangler CLI
3. ลบโปรเจกต์ทั้งหมด (ในกรณีที่วิกฤตจริงๆ)
หากคุณไม่แน่ใจว่าไฟล์ยังค้างอยู่ในระบบรึเปล่า และต้องการเคลียร์ทุกอย่างให้เกลี้ยง 100% คุณสามารถลบโปรเจกต์นั้นทิ้งแล้วสร้างใหม่ได้เลยครับ:
- เข้าไปที่โปรเจกต์ Pages นั้นบน Dashboard
- ไปที่แท็บ Settings > Settings (เมนูย่อย)
- เลื่อนลงมาล่างสุดจะเจอโซน Danger Zone
- คลิก Delete project เพื่อลบทุกอย่างออกจาก Cloudflare
💡 คำแนะนำเพิ่มเติม: หากไฟล์ที่หลุดไปเป็น API Key, รหัสผ่าน หรือ Token สำคัญ ให้รีบเข้าไปสั่ง Revoke (ยกเลิกการใช้งาน) หรือเปลี่ยนรหัสผ่านของระบบนั้นๆ ทันทีครับ เพราะระบบ Search Engine หรือบอทอาจจะเข้ามาเก็บข้อมูลไปแล้วในช่วงเวลาสั้นๆ นั้นครับ
น่าจะมีส่วนเสริมหรือโปรแกรม สครปที่ใช้ด฿งดูไฟลทั้งหมดของเราได้นะ ใน cloudflare
เข้าใจเลยครับว่าในมุมคนใช้งาน มันควรจะมีปุ่มหรือคำสั่งให้เราดึงไฟล์ที่เคยอัปโหลดไปแล้วกลับลงมาได้ง่าย ๆ แต่ Cloudflare Pages จงใจออกแบบมาให้ไม่มีฟังก์ชันในการดาวน์โหลดไฟล์ทั้งหมดกลับลงมาครับ ไม่ว่าจะผ่านหน้า Dashboard, ผ่านคำสั่ง Wrangler CLI หรือแม้กระทั่งผ่าน Cloudflare API ก็ตาม [1, 2, 3, 4]
เหตุผลหลักเป็นเพราะ Cloudflare ทำหน้าที่เป็นเครือข่ายกระจายข้อมูล (Global CDN/Static Hosting) เมื่อเราอัปโหลดไฟล์ขึ้นไป ระบบจะทำการกระจาย (Deploy) ไฟล์เหล่านั้นไปยังเซิร์ฟเวอร์นับร้อยแห่งทั่วโลกทันที และมองมันเป็นระบบ “เขียนทับ/สร้างเวอร์ชันใหม่” (Immutable Versioning) เท่านั้น ไม่ได้ทำหน้าที่เป็น Cloud Storage (เช่น Google Drive หรือ Dropbox) ที่มีเมนูให้เข้าไปเปิดดูโฟลเดอร์หรือกด Download Zip ย้อนหลังได้ครับ [1, 2, 3]
อย่างไรก็ตาม หากคุณประสบปัญหา “ไฟล์ต้นฉบับในเครื่องหาย” หรือจำเป็นต้องดึงไฟล์ทั้งหมดกลับมาจริงๆ มีวิธีทางเลือก (Workaround) ที่นักพัฒนาใช้กันอยู่ 2 วิธีหลักๆ ครับ:
1. ใช้โปรแกรมประเภท Web Scraper / Crawler (ดึงจากหน้าเว็บโดยตรง)
เนื่องจากไฟล์ที่เราอัปโหลดไปถูกเปิดเป็นเว็บไซต์สาธารณะแล้ว วิธีที่ง่ายที่สุดคือการใช้เครื่องมือดูดหน้าเว็บกลับลงมา (จะดึงได้เฉพาะไฟล์ที่เป็น Public เช่น HTML, CSS, JS, และรูปภาพ แต่จะไม่สามารถดึงโค้ดฝั่ง Server-side หรือ Pages Functions ได้)
- ใช้คำสั่ง Command Line (wget): หากคุณใช้ Mac/Linux หรือดาวน์โหลด wget มาบน Windows สามารถใช้คำสั่งนี้เพื่อดูดไฟล์ทั้งหมดจาก URL ของ Cloudflare Pages ของคุณได้:bash
wget --mirror --page-requisites --adjust-extension --no-parent https://pages.devUse code with caution. - ใช้ส่วนเสริม Browser (Extension): มีเครื่องมือหรือ Extension ฟรี เช่น EasyScraper หรือ WebScraper.io ที่สามารถช่วยสั่งดาวน์โหลด Assets ทั้งหมดที่แสดงอยู่บนหน้าเว็บลงมาเก็บไว้ในเครื่องได้เช่นกันครับ [1]
2. ตรวจสอบผ่านคำสั่งประวัติการ Deploy (ได้แค่รายชื่อไฟล์ ไม่ได้ตัวไฟล์)
ถ้าคุณแค่อยากรู้ว่าในรอบนั้นมีไฟล์ชื่ออะไรบ้าง (เช่น เช็กว่าไฟล์สำคัญหลุดไปไหม) คุณสามารถใช้คำสั่งเพื่อเรียกดูสถานะหรือรายละเอียดการ Deploy ผ่าน Wrangler CLI ได้: [1]
bash
npx wrangler pages deployment list
Use code with caution.
(คำสั่งนี้จะบอกลิสต์ของ Deployment ID และ Preview URL ทั้งหมด แต่ไม่สามารถดึง Source Code ที่อัปโหลดไปกลับลงมาได้อยู่ดีครับ) [1]
สรุปคำแนะนำที่ปลอดภัยที่สุดในระยะยาว:
แนะนำให้เปลี่ยนมาใช้วิธี เชื่อมต่อกับ GitHub หรือ GitLab แทนการใช้ Direct Upload (ลากวางโฟลเดอร์) ครับ เพราะตัว Git จะทำหน้าที่เป็นโปรแกรมเก็บโค้ดต้นฉบับของคุณอย่างปลอดภัย 100% สามารถดึงกลับมาเมื่อไหร่ก็ได้ ย้อนดูประวัติไฟล์ได้ทุกนาที ส่วน Cloudflare Pages จะทำหน้าที่เพียงแค่อ่านไฟล์จาก Git ไปเปิดเป็นหน้าเว็บให้เฉยๆ ครับ [1]
ตอนนี้คุณประสบปัญหา ไฟล์ในเครื่องคอมพิวเตอร์สูญหาย หรือว่าแค่อยาก ตรวจสอบให้แน่ใจว่าไม่มีไฟล์อื่นหลุดขึ้นไป ครับ? สามารถบอกเพิ่มเติมเพื่อหาทางแก้ร่วมกันได้ครับ
เชื่อมต่อกับ GitHub หรือ GitLab จะทำให้ไม่ต้อง Direct Upload ซึ่งจัดการได้ง่ายกว่าใช่ไหม?
ใช่เลยครับ! ถูกต้องที่สุดครับ การเชื่อมต่อ Cloudflare Pages เข้ากับ GitHub หรือ GitLab เป็นวิธีมาตรฐานที่คนส่วนใหญ่เลือกใช้ เพราะมันปลอดภัยกว่าและจัดการได้ง่ายกว่าการลากวางโฟลเดอร์ (Direct Upload) แบบหน้ามือเป็นหลังมือเลยครับ
เหตุผลที่คุณควรเปลี่ยนมาใช้ Git มี 3 ข้อหลักๆ ดังนี้ครับ:
1. มี “ที่ฝากไฟล์ต้นฉบับ” ที่กดดาวน์โหลดกลับมาเมื่อไหร่ก็ได้
- แบบเดิม (Direct Upload): ถ้าคอมพิวเตอร์พัง หรือเผลอลบโฟลเดอร์ในเครื่องทิ้ง ไฟล์จะหายทันที เพราะฝั่ง Cloudflare ไม่มีปุ่มให้ดาวน์โหลดไฟล์กลับลงมา
- แบบต่อ Git: ไฟล์โค้ดทั้งหมดของคุณจะถูกเก็บไว้บน Cloud ของ GitHub/GitLab อย่างปลอดภัย ต่อให้คอมพิวเตอร์พัง คุณแค่กดปุ่ม Download ZIP หรือสั่ง
git cloneลงมาในคอมพิวเตอร์เครื่องใหม่ ก็ได้ไฟล์ทั้งหมดกลับมาทำงานต่อได้ทันที 100%
2. อัปเดตเว็บอัตโนมัติ (ไม่ต้องคอยลากวางใหม่)
- แบบเดิม: ทุกครั้งที่แก้ไขโค้ด (แม้แก้แค่จุดเดียว) คุณต้องคอยสร้างโฟลเดอร์ ลากไฟล์ หรือบีบ Zip แล้วเอาไปโยนใส่หน้าเว็บ Cloudflare ทุกครั้ง
- แบบต่อ Git: คุณแค่กดบันทึกโค้ดแล้วสั่งส่งไฟล์ (Push) ขึ้น GitHub/GitLab ตามปกติ จากนั้นตัว Cloudflare Pages จะรู้ทันทีและไปดึงโค้ดเวอร์ชันล่าสุดมาอัปเดตหน้าเว็บให้คุณเองโดยอัตโนมัติ โดยที่คุณไม่ต้องเปิดหน้าเว็บ Cloudflare ทิ้งไว้ด้วยซ้ำครับ
3. ตรวจสอบและแก้ไขเวลา “อัปโหลดไฟล์ผิด” ได้ง่ายกว่ามาก
- แบบเดิม: ถ้าลากโฟลเดอร์ที่มีไฟล์สำคัญติดไปด้วย คุณจะไม่รู้เลยจนกว่าจะเปิดหาทีละหน้า หรือต้องกดลบ Deployment ทิ้งทั้งหมด
- แบบต่อ Git: บน GitHub/GitLab จะมีแท็บที่เรียกว่า Commits ซึ่งจะไฮไลต์ให้เห็นเลยว่า ในการอัปเดตครั้งนี้คุณมีการเพิ่มไฟล์ไหน ลบไฟล์ไหน หรือแก้ไขบรรทัดไหนบ้าง ทำให้คุณตรวจทานได้ก่อนเว็บจะทำงานจริง และถ้าพลาดอัปโหลดไฟล์ผิดขึ้นไป คุณก็แค่ลบไฟล์นั้นในเครื่อง สั่ง Push ทับ หน้าเว็บก็เปลี่ยนตามทันที (ส่วนประวัติโค้ดเก่าใน Git ก็สามารถสั่งลบแบบถาวรได้)
💡 คำแนะนำเพื่อความปลอดภัยสูงสุด
ถ้าคุณไม่อยากให้คนอื่นเห็นไฟล์โค้ด หรือกลัวคนมาแอบดูไฟล์ในเว็บของคุณ ตอนสร้าง Repository บน GitHub หรือ GitLab ให้เลือกตั้งค่าเป็น Private (ส่วนตัว) ครับ
- คนภายนอกจะไม่สามารถเข้ามาดูโค้ดของคุณได้เลย
- มีเพียงคุณ และระบบ Cloudflare Pages (ที่คุณอนุญาต) เท่านั้นที่เข้าถึงโค้ดนี้เพื่อนำไปเปิดเป็นหน้าเว็บได้ครับ
ตอนนี้โปรเจกต์ของคุณมีบัญชี GitHub หรือ GitLab อยู่แล้วหรือยังครับ? หากยังไม่มี หรืออยากให้แนะนำขั้นตอนการผูก Git เข้ากับ Cloudflare Pages ตั้งแต่เริ่มต้น สามารถบอกได้เลยนะครับ!
สำหรับการเชื่อมต่อ Cloudflare Pages ร่วมกับ GitHub หรือ GitLab นั้น ฟรี 100% สำหรับการใช้งานทั่วไปและเว็บไซต์ขนาดเล็กถึงปานกลาง โดยไม่ต้องกรอกบัตรเครดิต และรองรับการทำโปรเจกต์แบบ Private Repository (ซ่อนโค้ดเป็นส่วนตัว) ได้ฟรีเช่นกันครับ
ตารางเปรียบเทียบสเปกและข้อจำกัดของ แผนฟรี (Free Tier) ที่คุณควรรู้มีดังนี้ครับ:
📊 สเปกและข้อจำกัดแผนฟรี (Cloudflare + Git)
| บริการ / ฟีเจอร์ | รายละเอียดและข้อจำกัดในแผนฟรี (Free Tier) | จุดเด่น / ข้อควรระวัง |
|---|---|---|
| ค่าใช้จ่าย (Cost) | $0 บาท (ฟรีตลอดชีพ ไม่ต้องผูกบัตร) | ใช้ในเชิงพาณิชย์/ทำธุรกิจได้ |
| Bandwidth (การเข้าชมเว็บ) | Unlimited (ไม่จำกัด) | คนเข้าเว็บพร้อมกันเยอะๆ เว็บไม่ล่มและไม่คิดเงินเพิ่ม |
| Build Limits (จำนวนการอัปเดต) | 500 ครั้ง / เดือน (นับรวมทั้งบัญชี) | เฉลี่ยอัปเดตเว็บได้วันละ ~16 ครั้ง (เหลือเฟือสำหรับคนเดียว) |
| Concurrent Build (คิวการ Build) | 1 Build ณ ช่วงเวลานั้น | ถ้ากด Push โค้ดถี่ๆ ระบบจะต่อคิวทำทีละรอบ |
| จำนวนไฟล์สูงสุด (Files per Site) | 20,000 ไฟล์ / เว็บไซต์ | นับรวมไฟล์ HTML, JS, CSS และรูปภาพทั้งหมดในเว็บ |
| ขนาดไฟล์สูงสุด (Max File Size) | 25 MiB / ไฟล์ | ห้ามมีไฟล์ใดไฟล์หนึ่ง (เช่น รูปใหญ่หรือวิดีโอ) เกิน 25MB |
| Custom Domain (โดเมนตัวเอง) | 100 โดเมน / โปรเจกต์ | สามารถต่อชื่อเว็บตัวเอง เช่น mysite.com ได้ฟรี |
| พื้นที่เก็บโค้ดบน GitHub | 1 GB per Repository | เป็นโควตาฝั่ง GitHub สำหรับเก็บโค้ดต้นฉบับ |
🛠️ ขั้นตอนการผูก GitHub เข้ากับ Cloudflare Pages
หากคุณเลือกใช้ GitHub (ซึ่งเป็นที่นิยมที่สุด) สามารถตั้งค่าเชื่อมต่อแบบอัตโนมัติได้ง่ายๆ ใน 5 ขั้นตอน
- เตรียม Repository บน GitHub:
- สมัคร/ล็อกอินเข้า GitHub
- สร้าง Repository ใหม่ (กด New)
- ตั้งชื่อโปรเจกต์ และเลือกเป็น Private (เพื่อความปลอดภัยไม่ให้คนอื่นเห็นโค้ด) จากนั้นอัปโหลดไฟล์เว็บของคุณขึ้นไปเก็บไว้
- เชื่อมต่อที่ Cloudflare:
- ไปที่หน้า Cloudflare Dashboard > เข้าเมนู Workers & Pages
- คลิกปุ่ม Create > เลือกแท็บ Pages > คลิก Connect to Git
- ผูกบัญชี GitHub:
- ระบบจะให้คุณกดยืนยันเพื่อเชื่อมต่อเข้ากับบัญชี GitHub ของคุณ
- คุณสามารถเลือกได้ว่าจะให้ Cloudflare เข้าถึง ทุก Repository หรือ เฉพาะบางอันที่เลือกไว้ (แนะนำให้เลือกเฉพาะอันที่จะทำเว็บเพื่อความเป็นส่วนตัว)
- เลือกโปรเจกต์และตั้งค่า:
- เลือก Repository ที่คุณเพิ่งสร้างไว้
- ตั้งชื่อโปรเจกต์ (จะเป็นชื่อ URL บน
.pages.dev) - ในส่วน Build settings ตัว Cloudflare จะฉลาดพอที่จะเดาให้เองว่าเว็บคุณเป็น HTML ธรรมดา หรือใช้ Framework ตัวไหน (ถ้าเป็นเว็บสำเร็จรูป เช่น React, Next.js หรือ Vue) [1]
- กด Deploy:
- คลิก Save and Deploy [1]
หลังจากกดปุ่มนี้เสร็จ Cloudflare จะทำการดึงโค้ดจาก GitHub ไปสร้างเป็นเว็บไซต์ให้คุณทันที และหลังจากนี้ ทุกครั้งที่คุณแก้ไขโค้ดในเครื่องแล้ว Push ขึ้น GitHub ระบบของ Cloudflare จะตรวจจับและอัปเดตหน้าเว็บให้คุณเองโดยอัตโนมัติ 24 ชั่วโมงครับ [1]
คุณต้องการให้ผมแนะนำวิธีอัปโหลดไฟล์จากคอมพิวเตอร์ขึ้น GitHub (เช่น การใช้โปรแกรม GitHub Desktop เพื่อความง่ายโดยไม่ต้องพิมพ์โค้ด) เพิ่มเติมด้วยไหมครับ หรือติดขัดในขั้นตอนไหนสามารถบอกได้เลยครับ!