Cloudflare ฟรีที่คนสนใจ DevOps ไม่ควรมองข้าม

Free tier ของ Cloudflare ได้อะไรบ้าง

ราคา/limit อาจปรับได้ ตรวจสอบที่ cloudflare.com อีกที — สรุปจุดเด่นที่ใช้กันบ่อย:

• CDN ทั่วโลก — 300+ data center รวมกรุงเทพฯ ด้วย
• DDoS Protection ระดับ enterprise ฟรีทุก plan
• DNS เร็วและฟรี ไม่จำกัด record
• SSL/TLS ฟรีรวม wildcard
• Cloudflare Pages — host static site / Next.js, build ฟรี 500/เดือน, bandwidth ไม่จำกัด
• Workers — serverless function 100,000 request/วัน, 10ms CPU time/request
• R2 (object storage) — 10GB ฟรี, ไม่คิด egress (ต่างจาก S3 ที่คิด egress แพง)
• D1 (SQLite database) — 5GB, 5M reads/วัน, 100k writes/วัน
• KV (key-value store) — 100k reads/วัน, 1k writes/วัน
• Web Analytics — privacy-friendly ไม่ต้องใช้ cookie

หลายอย่างให้ฟรีเยอะกว่า hosting จ่ายเงินด้วยซ้ำ

ตั้งโดเมนแรก

1. ซื้อ domain ที่ไหนก็ได้ (Namecheap, Cloudflare Registrar, GoDaddy)
2. สมัคร Cloudflare → Add a Site → เลือก Free plan
3. Cloudflare scan DNS เก่า → confirm
4. Cloudflare แจ้ง nameserver 2 ตัว เช่น kate.ns.cloudflare.com, tom.ns.cloudflare.com
5. กลับไปที่ registrar → เปลี่ยน nameserver เป็นของ Cloudflare
6. รอ 5 นาที - 1 ชั่วโมง propagate

ตรวจสอบสำเร็จยัง:

dig +short NS yourdomain.com
# ควรขึ้น *.ns.cloudflare.com

ตั้งค่าที่แนะนำให้เปิด

ใน dashboard ของแต่ละ domain:

SSL/TLS

ตั้ง mode เป็น Full (strict) ถ้า origin server มี SSL จริง ถ้ายังไม่มีตั้ง Full ก่อน

อย่าใช้ Flexible เพราะ Cloudflare→origin เป็น HTTP ไม่ปลอดภัย

เปิด:

• Always Use HTTPS
• HTTP Strict Transport Security (HSTS) — set max-age 12 เดือน
• TLS 1.3 (default เปิดอยู่)
• Automatic HTTPS Rewrites

Speed → Optimization

• Auto Minify (HTML/CSS/JS) — บีบ
• Brotli — บีบดีกว่า gzip
• Early Hints — preload resource ก่อน HTML response
• Rocket Loader — defer JS load (เปิดถ้าไม่ใช้ React/Vue ที่ต้องรัน JS เร็ว)

Caching → Configuration

Browser Cache TTL: ตั้งตาม project ปกติใช้ 4 ชั่วโมง — 1 วัน

Security → WAF

• Managed Rules — ฟรี เปิดเลย
• Bot Fight Mode — กัน bot crawl

Cloudflare Pages — host static site ฟรีไม่จำกัด

ดีกว่า Vercel ตรงที่ bandwidth ไม่จำกัด build minute ใจกว้างกว่า

ถ้าใช้ Next.js:

# ติดตั้ง
npm install -D @cloudflare/next-on-pages

# เพิ่ม script ใน package.json
"pages:build": "npx @cloudflare/next-on-pages"
"deploy": "wrangler pages deploy .vercel/output/static"

หรือเชื่อม GitHub repo ตรงๆ:

1. Pages → Create a project → Connect to Git
2. เลือก repo
3. Framework preset: Next.js
4. Build command: npx @cloudflare/next-on-pages
5. Build output directory: .vercel/output/static

ทุกครั้งที่ push deploy ให้อัตโนมัติ + preview deployment ของแต่ละ PR

Cloudflare Workers — serverless ที่ดีและถูก

ใช้ Workers แทน Lambda ดีกว่าตรงที่:

• cold start ~5ms (Lambda 100-300ms)
• ราคา 100k req/วัน ฟรี Lambda 1M/เดือน ฟรี (Workers ใจกว้างต่อวัน)
• รัน V8 isolate ไม่ใช่ container = light + fast

ตัวอย่าง Worker ที่ใช้ในชีวิตจริง — proxy รูปภาพจาก S3 + cache:

// src/worker.js
export default {
  async fetch(request, env, ctx) {
    const url = new URL(request.url)
    const key = url.pathname.slice(1)

    if (!key) return new Response('Not found', { status: 404 })

    // ลอง cache ก่อน
    const cache = caches.default
    let response = await cache.match(request)
    if (response) return response

    // ดึงจาก R2
    const object = await env.BUCKET.get(key)
    if (!object) return new Response('Not found', { status: 404 })

    response = new Response(object.body, {
      headers: {
        'Content-Type': object.httpMetadata?.contentType ?? 'image/jpeg',
        'Cache-Control': 'public, max-age=31536000, immutable',
      },
    })

    // เก็บใน cache
    ctx.waitUntil(cache.put(request, response.clone()))
    return response
  },
}

wrangler.toml:

name = "image-proxy"
main = "src/worker.js"
compatibility_date = "2025-12-01"

[[r2_buckets]]
binding = "BUCKET"
bucket_name = "my-images"

deploy:

npm install -g wrangler
wrangler login
wrangler deploy

R2 — object storage ที่ไม่คิด egress

S3 คิดเงิน 2 ส่วน — เก็บข้อมูล + ดาวน์โหลดออก (egress) ถ้าเสิร์ฟ image/video เยอะ egress คือตัวกินเงิน

R2 ไม่คิด egress เลย → เหมาะกับเสิร์ฟ media

ราคาเก็บข้อมูล: $0.015/GB/เดือน ถูกกว่า S3 (~$0.023)

ใช้ AWS SDK ได้เลยเพราะ R2 มี S3-compatible API:

import { S3Client, PutObjectCommand } from '@aws-sdk/client-s3'

const r2 = new S3Client({
  region: 'auto',
  endpoint: `https://${ACCOUNT_ID}.r2.cloudflarestorage.com`,
  credentials: {
    accessKeyId: process.env.R2_ACCESS_KEY,
    secretAccessKey: process.env.R2_SECRET_KEY,
  },
})

await r2.send(new PutObjectCommand({
  Bucket: 'my-bucket',
  Key: 'photo.jpg',
  Body: fileBuffer,
  ContentType: 'image/jpeg',
}))

Page Rules / Rules / Workers Routes

Cloudflare เคยมี Page Rules ฟรี 3 rules — ตอนนี้ migrate เป็น Rules (Configuration Rules, Cache Rules, Redirect Rules) แต่ละ category มี limit แยก

ที่ใช้บ่อย:

Redirect www → root

• Redirect Rules → Custom URL → match www.yourdomain.com/* → redirect https://yourdomain.com/$1

Bypass cache สำหรับ /api/

• Cache Rules → match URI Path equals /api/* → Cache eligibility: Bypass cache

Cache static assets นาน

• Cache Rules → match File extension in js,css,woff2,png,svg → Edge TTL: 1 month

Web Analytics — Google Analytics ทางเลือก

privacy-first ไม่ใช้ cookie GDPR-friendly เปิดใช้:

1. Cloudflare → Analytics & Logs → Web Analytics
2. Add a site → ใส่ domain
3. คัดลอก script ที่ให้ → ใส่ <head> ของเว็บ

ดูได้: pageview, unique visitor, country, browser, referrer ครบเหมือน GA4 แต่ไม่ขายข้อมูลผู้ใช้

ข้อควรระวัง

Free plan ไม่มี SLA — ถ้าระบบมีปัญหา Cloudflare ไม่รับผิดชอบเหมือน paid plan

Worker free tier 10ms CPU — ทำงานหนักไม่ได้มาก ถ้าทำ image processing, large response อาจติด limit

R2 / D1 / KV ใหม่กว่า ความเสถียรอาจไม่เท่า S3 / RDS — production ที่ critical ลองทดสอบให้ดีก่อน

บาง feature ต้อง upgrade เช่น Image Resizing, Workers Unbound (รัน CPU นาน)

สรุป

ถ้าเริ่ม project ใหม่ — ใส่ Cloudflare หน้า DNS ก่อนเลย ฟรีและทำให้เว็บเร็ว ปลอดภัย ทันที

ถ้าโต project ขึ้น — Pages + Workers + R2 อาจเป็น stack ที่จบครบ โดยไม่ต้องไปจ่าย Vercel + AWS แยก