วิธีเก็บรูปภาพไว้ใน Cloudflare Storage เพื่อนำมาใช้กับ WordPress

image for wordpress on cloudflare link

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

  1. เช่า Host ที่เป็น Share Host มีพื้นที่ในการจัดเก็บข้อมูลไม่มาก (เริ่มตั้งแต่ 2 GB ขึ้นไป) ในราคาไม่ถึง 1,000 บาท  
  2. จดโดเมน ราคาของการจดชื่อและโดเมนรขึ้นอยู่กับชื่อเว็บไซต์ที่คุณตั้งชื่อไว้ ตั้งแต่ 400 บาทขึ้นไป

เพียงแค่ 2 อย่างนี้คุณก็สามารถสร้างเว็บไซต์เป็นของตนเองได้แล้ว แต่คุณอาจจะประสบปัญหาในเรื่องของพื้นที่การจัดเก็บข้อมูลที่น้อยมาก เพราะเว็บไซต์ของคุณมีข้อมูลบทความหรือข้อมูลรูปภาพเป็นจำนวนมาก

Cloud Storage

Cloud storage (บริการจัดเก็บข้อมูลบนคลาวด์) คือการจัดเก็บข้อมูลและข้อมูลอื่น ๆ ออนไลน์ผ่านอินเทอร์เน็ตบนเซิร์ฟเวอร์ที่อยู่ในศูนย์ข้อมูลหรือเครือข่ายคลาวด์ของผู้ให้บริการ

หากคุณจำกัดการใช้งานบน Host ด้วยพื้นที่น้อย และการเพิ่มพื้นที่ Share Host ต้องจ่ายเพิ่มขึ้นอีกเท่าตัว ทางแก้ไขในการเขียนบทความที่มีจำนวนภาพเยอะๆคือ การฝากรูปภาพไว้ตามแหล่งต่างๆ แล้วนำลิงค์มาใช้ คือการนำภาพไปฝากไว้ที่ Cloud Storage ซึ่งบริการที่ฝาก Cloud Storage มีดังนี้

  1. Google Cloud Storage
  2. Amazon S3
  3. Microsoft Azure Blob Storage
  4. Cloudflare

ในการให้บริการ การคิดค่าบริการก็แล้วแต่เงื่อนไขของผู้ให้บริการ และความยากง่ายในการใช้บริการ

แนะนำ Cloudflare R2

เนื่องจากเว็บไซต์ของผมที่คุณผู้อ่านกำลังติดตามอยู่นี้ ได้จดโดเมนที่ Cloudflare ผมได้ลองใช้ Google Cloud Storage ในการจัดเก็บรูปภาพที่จะใช้ในการเขียนบทความมีความรู้สึกว่าการใช้งานที่ค่อนข้างซับซ้อน เนื่องจากความต้องการของผมคือ การอับโหลดรูปภาพไว้ใน Cloud Storage แล้วนำลิงค์นั้นมาใช้งาน และ Cloudflare สามารถทำตามความต้องการของผมได้ ดังนั้นผมจึงมาแชร์ความรู้สำหรับมือใหม่ครับ

เหตุผลที่ผมเลือก Cloudflare

  1. จดโดเมนที่ Cloudflare
  2. Cloudflare มีฟังก์ชันในการทำ Image Optimization เพื่อทำให้เว็บของเราเร็วขึ้น มีผลต่อ SEO (แต่ฟังก์ชันนี้ต้องเสียเงินเพิ่ม การแก้ไขคือ อับโหลดรูปภาพที่เป็น Webp ไปก่อน)
  3. การนำลิงค์รูปภาพบน Cloudflare ไปแทรกในเว็บไซต์ WordPress ได้เลย ไม่ต้องติดตั้ง Plugin ใน WordPress และรับความเสี่ยงในข้อผิดพลาดเมื่อ Plugin ทำงานผิดพลาดไม่สามารถส่งรูปภาพไปยัง Cloud Storage ได้
  4. ให้พื้นที่ฟรี 10GB หากเว็บไซต์ของคุณมีการจัดเก็บข้อมูลและมีผู้เยี่ยมชมที่มาก ค่าบริการจะขึ้นอยู่กับแบนด์วิธที่อ่านและเขียน

เริ่มต้นใช้งาน Cloudflare R2

  1. ลงชื่อเข้าใช้บริการ Cloudflare หากยังไม่ได้สมัครใช้บริการ ให้ทำการสร้างบัญชีเพื่อใช้งาน
  2. สร้างที่เก็บข้อมูล
  3. อัปโหลดไฟล์โปรเจ็ค
  4. นำลิงค์ไปใช้งาน
สร้างบัญชีหรือลงชื่อเข้าใช้บริการ

หากยังไม่มีบัญชี Cloudflare ให้ทำการสร้างบัญชีโดย

  • ไปที่หน้า Cloudflare
  • กรอกอีเมลและรหัสผ่านของคุณ
  • คลิกสร้างบัญชี

เมื่อสร้างบัญชีแล้ว Cloudflare จะส่งอีเมลไปยังที่อยู่ของคุณโดยอัตโนมัติเพื่อยืนยันที่อยู่อีเมลนั้น

หากคุณมีบัญชีแล้วให้ทำการ Signin ระบบเข้าไป ตัวอย่างรูปภาพด้านล่างเก็บไว้ใน Cloudflare R2

ในเมนูด้านซ้ายมือเลือก R2 และกดที่ปุ่ม Create bucket

ทำการตั้งชื่อ Bucket ที่ต้องการใช้งานให้สอดคล้องกับเว็บไซต์ที่ต้องการ

การเพิ่ม Domains

Bucket จะยังไม่สามารถใช้งานได้ หากไม่ทำการเพิ่ม Domains ให้กับ Bucket ในการเพิ่ม Domains นี้ หากคุณมี Domains ที่ไม่ได้ใช้งาน ก็สามารถสร้างได้เลย (ผมได้ทดลองใช้ Domains ที่สร้างเว็บ visitors-it.com นี้แล้ว ผลปรากฏว่า เว็บผมเข้าได้เฉพาะ www.visitors-it.com ไม่สามารถเข้าผ่าน https://visitors-it.com ได้ เนื่องจากเอา visitors-it.com ไปสร้าง Domains ที่เป็นที่อยู่ของรูปภาพ หากใครประสบปัญหานี้ ให้ลบ Domains ที่เอามาสร้าง Buckket ออก) หรือหากใครที่ยังไม่มี Domains ที่จะนำมาสร้างลิงค์ให้กับรูปภาพ ให้ใช้ R2.dev subdomain ซึ่งสร้างโดย Cloudflare มาใช้งานได้ครับ

R2.dev subdomain มีหน้าที่ในการสร้าง Subdomain ให้ใช้ เพื่อสร้างลิงค์ไปยังรูปภาพ และการสร้าง R2.dev subdomain ไม่มีค่าใช้จ่ายเพิ่มขึ้นแต่อย่างใด

วิธีการเปิดใช้งาน R2.dev subdomain ดังภาพด้านล่าง

  1. เข้าไปใน Bucket ที่สร้าง แล้วดูที่หัวข้อ Domains  หากขึ้น “Not allowed” ให้กดเข้าไปใน Setting
  2. เลื่อนมาที่ช่อง Public access ที่หัวข้อ “R2.dev subdomain” จะมีปุ่มสีแดงที่เขียนว่า “Allow Connect”  ให้กดเพื่อเชื่อมต่อได้เลย เมื่อเชื่อมต่อกับ Domains เรียบร้อยปุ่มจะกลายเป็นสีน้ำเงิน และข้อความ “Disallow Acess” ดังภาพ

เริ่มต้นใช้งาน Cloudflare R2

หลังจากที่สร้าง Bucket แล้ว การใช้งานก็ง่ายนิดเดียว เพียงเข้าไปใน Bucket ที่สร้างไว้ แล้วทำการลากรูปภาพเข้าไปใน Cloudflare R2 เพื่อทำการ Upload

การนำลิงค์รูปภาพไปใช้ใน WordPress

เมื่อคุณอัพโหลดรูปภาพเสร็จแล้ว คุณกดเข้าไปในรูปภาพแล้วทำการ Copy Link ที่อยู่ของรูปภาพ จากนั้นนำไปใช้กับ WordPress ได้เลย เพียงเท่านี้ก็เสร็จสิ้นแล้วครับ