SSL/HTTPS, Cloudflare Proxy, dan DNS Configuration

HTTPS melindungi data dan meningkatkan kepercayaan pengguna. Dengan Cloudflare dan reverse proxy, SSL bisa diatur otomatis. Namun konfigurasi yang salah sering menyebabkan redirect loop atau 502.

Sertifikat SSL/TLSCopy Anchor Link

Sertifikat berisi:

• Nama domain yang dilindungi.
• Public key.
• Masa berlaku.
• Tanda tangan Certificate Authority (CA).

Client memverifikasi sertifikat ke CA tepercaya. Sertifikat kedaluwarsa atau tidak cocok domain akan memicu peringatan browser.

Let's EncryptCopy Anchor Link

Let's Encrypt adalah CA gratis yang menerbitkan sertifikat melalui protokol ACME.

NPM dan banyak tool lain menangani permintaan serta perpanjangan otomatis.

Mode SSL CloudflareCopy Anchor Link

Cloudflare punya beberapa mode enkripsi antara client–Cloudflare dan Cloudflare–origin.

Mengapa Flexible berbahaya?Copy Anchor Link

Dengan Flexible, Cloudflare mengirim trafik ke origin lewat HTTP. Jika origin juga memaksa redirect ke HTTPS, terjadi redirect loop karena Cloudflare terus mengirim HTTP.

Browser --HTTPS--> Cloudflare --HTTP--> Origin --redirect HTTPS--> Cloudflare --HTTP--> ...

Gunakan Full (strict) dan pasang sertifikat valid di origin (Let's Encrypt atau Cloudflare Origin Certificate).

Cloudflare Origin CertificateCopy Anchor Link

Sertifikat ini diterbitkan Cloudflare untuk komunikasi Cloudflare–origin.

1. Buka SSL/TLS → Origin Server → Create Certificate.
2. Pilih hostname yang dicakup.
3. Simpan certificate dan private key.
4. Pasang di Nginx/NPM.
5. Set mode SSL ke Full (strict).

Sertifikat ini hanya dipercaya oleh Cloudflare, bukan browser umum. Itu tidak masalah karena browser melihat sertifikat edge Cloudflare.

Pengaturan penting di CloudflareCopy Anchor Link

Mixed contentCopy Anchor Link

Mixed content terjadi saat halaman HTTPS memuat resource HTTP (gambar, script, CSS). Browser modern memblokirnya.

Cek di DevTools → Console. Perbaikan:

• Ubah URL resource menjadi https://.
• Gunakan path relatif.
• Aktifkan Automatic HTTPS Rewrites di Cloudflare.
• Pastikan aplikasi menghasilkan URL HTTPS (header X-Forwarded-Proto).

Redirect loopCopy Anchor Link

Penyebab umum:

1. Cloudflare mode Flexible + origin redirect HTTPS.
2. Aplikasi memaksa HTTPS tetapi tidak mengenali X-Forwarded-Proto.
3. Aturan redirect berlapis di NPM dan Cloudflare.

Solusi:

• Gunakan Full (strict).
• Teruskan header X-Forwarded-Proto.
• Pilih satu tempat untuk redirect (Cloudflare atau origin).

Praktik: mengamankan aplikasiCopy Anchor Link

1. Pastikan DNS app.example.com mengarah ke server.
2. Di NPM, terbitkan sertifikat Let's Encrypt (DNS challenge bila perlu).
3. Di Cloudflare, set SSL/TLS ke Full (strict).
4. Aktifkan Always Use HTTPS.
5. Uji:

   Copy Text

   curl -I http://app.example.com
   curl -I https://app.example.com
   openssl s_client -connect app.example.com:443 -servername app.example.com

6. Pastikan HTTP redirect ke HTTPS dan sertifikat valid.
7. Cek DevTools tidak ada mixed content.

TroubleshootingCopy Anchor Link

RingkasanCopy Anchor Link

• HTTPS memakai sertifikat TLS; Let's Encrypt menyediakan sertifikat gratis.
• Gunakan Cloudflare Full (strict) dan sertifikat valid di origin.
• Hindari Flexible karena memicu redirect loop dan trafik tidak terenkripsi.
• Perhatikan mixed content, HSTS, dan header proxy.