Pada postingan kali ini saya akan berbagi dengan anda bagaimana Anda dapat membuat penyingkat URL domain khusus Anda sendiri menggunakan Cloudflare Workers. Baik Anda seorang pengembang web yang ingin menambah alat lain, pemilik bisnis yang ingin memberi merek pada tautan Anda tanpa label harga yang mahal, atau hanya seseorang yang suka mengutak-atik teknologi web, panduan langkah demi langkah ini ditujukan untuk Anda. Anda.
Sebagai pengembang web dan penggemar teknologi, saya selalu terpesona dengan hal-hal kecil yang membuat internet lebih efisien dan ramah pengguna. Suatu hari, saat berbagi URL yang sangat panjang dan berat dengan seorang kolega, saya mendapati diri saya menginginkan cara yang sederhana dan personal untuk mempersingkat tautan. Tentu saja, ada banyak layanan pemendek URL di luar sana, namun saya menginginkan sesuatu yang lebih terasa seperti “saya” – sesuatu yang dapat saya sesuaikan dan kendalikan.
Saat itulah saya menemukan ide untuk membuat penyingkat URL khusus saya sendiri menggunakan Cloudflare Workers. Rasanya seperti menemukan harta karun di lautan luas teknologi web. Saya tidak hanya dapat memperpendek URL, tetapi saya juga dapat melakukannya dengan nama domain saya sendiri, gratis! Kegembiraan atas penemuan ini mengingatkan saya pada saat pertama kali saya membuat situs web – yang penuh dengan pemberdayaan dan kemungkinan yang tak terbatas.
Apa yang membuat penemuan ini semakin menarik adalah menyadari bahwa ini bisa menjadi alternatif gratis yang fantastis untuk layanan populer seperti Bit.ly atau TinyURL untuk membuat tautan pendek bermerek pada domain khusus. Banyak bisnis dan individu membayar mahal untuk fungsi semacam ini, namun berikut adalah cara untuk mencapai hasil yang sama tanpa mengeluarkan uang sepeser pun.
Langkah 1: Daftarkan Nama Domain (Gunakan Domain Pendek)
Langkah pertama dalam membuat penyingkat URL khusus Anda adalah mendaftarkan nama domain. Ini akan menjadi dasar tautan pendek bermerek Anda, jadi pilihlah dengan bijak!
Berikut beberapa tip untuk membantu Anda memilih domain yang tepat:
- Tetap singkat: Inti dari penyingkat URL adalah untuk membuat tautan yang ringkas. Carilah nama domain dengan 3-5 karakter jika memungkinkan. Ini bisa berupa singkatan, akronim, atau kata yang menarik.
- Buat itu berkesan: Pilih sesuatu yang mudah diingat dan diketik. Ini akan memudahkan Anda dan orang lain untuk menggunakan tautan singkat Anda.
- Pertimbangkan merek Anda: Jika Anda menggunakan ini untuk bisnis atau merek pribadi, coba selaraskan domain dengan identitas merek Anda yang sudah ada.
- Cek ketersediaan: Domain yang pendek dan menarik sangat diminati. Anda mungkin perlu berkreasi atau mempertimbangkan domain tingkat atas (TLD) alternatif seperti .io, .co, atau .me jika pilihan pertama Anda tidak tersedia.
- Pikirkan tentang TLD: Meskipun .com populer, jangan menghindar dari TLD lainnya. Beberapa, seperti .link atau .click, mungkin cocok untuk penyingkat URL.
Berikut beberapa contoh untuk menginspirasi Anda:
- abc.link
- pergi.io
- shrt.co
- zap.me
Setelah memilih domain, Anda harus membelinya dari pencatatan domain. Beberapa opsi populer meliputi:
- Namecheap
- Ayo ayah
- cloudflare (Direkomendasikan – yang juga sangat nyaman karena kita akan menggunakan Cloudflare Workers)
Ingat, meskipun domain memerlukan biaya, ini adalah pembelian satu kali per tahun, dan sisa penyiapan penyingkat URL kami akan gratis menggunakan Cloudflare Workers.
Kiat pro: Sebelum menyelesaikan pembelian Anda, pastikan domain tidak dikaitkan dengan spam atau aktivitas jahat apa pun. Anda dapat memeriksa riwayatnya menggunakan alat seperti Domain Tools atau Wayback Machine.
Dengan domain baru Anda yang cemerlang, Anda siap untuk melanjutkan ke langkah berikutnya: menyiapkan Cloudflare untuk domain Anda. Namun kita akan membahasnya di bagian berikutnya.
Langkah 2: Konfigurasikan Catatan DNS untuk Domain Anda
Sekarang setelah Anda memiliki domain, saatnya menyiapkan konfigurasi DNS. Langkah ini penting untuk memastikan bahwa Cloudflare Workers Anda berfungsi dengan benar dengan domain Anda yang baru terdaftar.
Mari kita ikuti prosesnya:
1. Tambahkan Domain Anda ke Cloudflare
- Jika Anda belum melakukannya, buat akun Cloudflare gratis.
- Di dasbor Cloudflare Anda, klik “Tambahkan Situs” dan masukkan nama domain Anda.
- Cloudflare akan memindai catatan DNS yang ada. Hapus semua catatan yang ditemukannya (kecuali Anda juga menggunakan domain untuk email atau layanan penting lainnya, dalam hal ini, simpanlah).
2. Perbarui Nameserver (Abaikan langkah ini jika domain Anda terdaftar di Cloudflare)
- Cloudflare akan memberi Anda satu set server nama.
- Kunjungi situs web registrar domain Anda dan ganti server nama yang ada dengan yang disediakan oleh Cloudflare.
- Langkah ini mungkin memerlukan waktu hingga 24 jam untuk diterapkan secara global.
3. Konfigurasikan Catatan DNS
- Di pengaturan DNS Cloudflare Anda, kami akan menambahkan dua data A baru.
- Tambahkan yang berikut ini:
Tipe: A
Nama: @
Isi: 192.0.2.1
TTL: Mobil
Status proksi: Diproksi (awan oranye - sangat penting)
Tipe: A
Nama: www
Isi: 192.0.2.1
TTL: Mobil
Status proksi: Diproksi (awan oranye - sangat penting)
IP 192.0.2.1 ini adalah alamat “dummy” khusus. Ini disediakan untuk dokumentasi dan pengujian, yang membuatnya sempurna untuk kebutuhan kita.
4. Aktifkan Proksi Cloudflare
- Pastikan status proksi (ikon awan oranye) diaktifkan untuk data DNS Anda.
- Hal ini memungkinkan Cloudflare untuk mem-proxy lalu lintas Anda dan diperlukan agar Cloudflare Workers dapat berfungsi.
5. Verifikasi Konfigurasi
- Setelah perubahan server nama diterapkan, Cloudflare akan menampilkan domain Anda sebagai "Aktif".
- Anda dapat memverifikasi ini di dasbor Cloudflare.
Poin penting di sini adalah kami tidak mengarahkan domain Anda ke web hosting sebenarnya. Alamat 192.0.2.1 hanyalah pengganti. Cloudflare Worker Anda, yang akan kami siapkan selanjutnya, akan mencegat semua permintaan ke domain Anda dan menangani logika pemendekan URL.
Kiat Pro: Penyiapan ini berarti Anda tidak perlu membayar atau mengelola hosting web apa pun. Cloudflare Workers akan menangani semua pekerjaan berat, menjadikan solusi ini tidak hanya gratis tetapi juga sangat ringan dan mudah perawatannya.
Setelah DNS Anda dikonfigurasi dengan benar, Anda kini siap untuk melanjutkan ke bagian yang menarik – menyiapkan Cloudflare Worker Anda untuk menangani pemendekan URL.
Langkah 3: Membuat Pekerja Cloudflare
Sekarang domain kita sudah dikonfigurasi di Cloudflare, saatnya membuat Pekerja yang akan menangani pengalihan kita. Cloudflare Workers menyediakan lingkungan eksekusi tanpa server yang memungkinkan kami menjalankan kode kami di edge, dekat dengan pengguna kami untuk kinerja optimal.
1. Buat Pekerja Cloudflare
- Mengakses Bagian Pekerja:
- Masuk ke dasbor Cloudflare Anda.
- Navigasikan ke bagian “Pekerja” dari sidebar.
- Klik “Buat Layanan” jika ini adalah Pekerja pertama Anda, atau “Buat Pekerja” jika Anda sudah memiliki Pekerja.
- Beri Nama Pekerja Anda:
- Pilih nama deskriptif untuk Pekerja Anda, seperti “penanganan pengalihan massal”.
- Klik "Buat Layanan" untuk melanjutkan ke editor.
- Menulis Naskah Pekerja:
- Di editor, ganti kode default dengan skrip pengendali pengalihan:
ekspor default {
pengambilan asinkron(permintaan) {
const redirectMap = Peta baru([
["google", "https://www.google.com?subId1=google"],
["bing", "https://www.bing.com?subId1=bing"],
// Tambahkan lebih banyak pengalihan di sini sesuai kebutuhan
]);
const url = URL baru(permintaan.url);
console.log("URL Lengkap:", url.toString());
console.log("Nama Host:", url.namahost);
console.log("Nama Jalur:", url.nama jalur);
biarkan path = url.pathname.toLowerCase().replace(/^\//, '').split('/')[0];
if (url.namahost.termasuk('pekerja.dev')) {
jalur = url.nama jalur.toLowerCase().replace(/^\//, '').split('/')[1] || '';
}
console.log("Jalur yang diproses:",jalur);
lokasi const = redirectMap.get(jalur);
console.log("Pengalihan lokasi:", lokasi);
// Ubah ke 301 untuk pengalihan permanen
jika (lokasi) {
return Response.redirect(lokasi, 302);
}
// Jika permintaan tidak ada di peta, kembalikan 404 atau fallback pilihan Anda
return Respon baru(`Tidak Ditemukan: ${path}`, { status: 404 });
},
};
- Memahami Naskah:
- Kami mendefinisikan a redirectMap yang berisi jalur pendek kami dan URL lengkapnya yang sesuai.
["google", "https://www.google.com?subId1=google"],
yourshorturl.com/google dialihkan ke -> https://www.google.com?subId1=google
["bing", "https://www.bing.com?subId1=bing"],
yourshorturl.com/bing dialihkan ke -> https://www.bing.com?subId1=bing
- Skrip memproses permintaan masuk, mengekstrak jalur, dan memeriksa apakah cocok dengan pengalihan yang kami tentukan.
- Jika kecocokan ditemukan, ia mengembalikan 302 (Pengalihan Sementara) ke URL yang sesuai.
- Jika tidak ditemukan kecocokan, ia akan mengembalikan respons 404 Tidak Ditemukan.
- Menguji Pekerja:
- Gunakan fitur “Edit Cepat” di dasbor Cloudflare untuk membuat perubahan dan menguji Pekerja Anda.
- Anda dapat menggunakan alat pengujian HTTP yang disediakan untuk menyimulasikan permintaan dan melihat bagaimana respons Pekerja Anda.
- Menyebarkan Pekerja:
- Setelah Anda puas dengan pengujian Anda, klik “Simpan dan Terapkan” untuk membuat Pekerja Anda aktif.
- Menyiapkan Rute Pekerja:
- Setelah menerapkan, buka tab “Pemicu” untuk Pekerja Anda.
- Tambahkan rute yang cocok dengan domain Anda, seperti *merekomendasikan.link/*.
- Hal ini memastikan bahwa semua permintaan ke domain Anda ditangani oleh Pekerja ini.
- Memverifikasi Pengaturan:
- Coba akses beberapa jalur pengalihan Anda (misalnya, https://recommends.link/url-shortener-guide) untuk memastikan mereka berfungsi seperti yang diharapkan.
- Periksa Log Pekerja di dasbor Cloudflare Anda untuk melihat output konsol dan verifikasi bahwa jalur diproses dengan benar.
Langkah 4: Lebih Banyak Penyesuaian (Opsional)
Pengalihan Dinamis dengan Cloudflare KV
Untuk membuat sistem pengalihan kami lebih fleksibel dan mudah dikelola, kami dapat menggunakan penyimpanan Cloudflare KV (Key-Value) untuk menyimpan pengalihan kami:
Buat Ruang Nama KV:
- Di dasbor Cloudflare Anda, buka Pekerja > KV. Klik “Buat namespace” dan beri nama (misalnya, “REDIRECT_MAP”).
- Buka pengaturan Pekerja Anda. Di bawah “KV Namespace Bindings”, tambahkan pengikatan baru. Pilih namespace KV Anda dan beri nama variabel (misalnya, REDIRECTS).
ekspor default {
async ambil(permintaan, env) {
const url = URL baru(permintaan.url);
const path = url.pathname.toLowerCase().replace(/^\//, '').split('/')[0];
lokasi const = menunggu env.REDIRECTS.get(path);
jika (lokasi) {
return Response.redirect(lokasi, 301);
}
return Respon baru(`Tidak Ditemukan: ${path}`, { status: 404 });
},
};
Anda sekarang dapat menambah, memperbarui, atau menghapus pengalihan dengan memodifikasi penyimpanan KV tanpa mengubah kode Pekerja.
Pengalihan Berparameter
Izinkan parameter dinamis dalam pengalihan Anda:
ekspor default {
async ambil(permintaan, env) {
const url = URL baru(permintaan.url);
const [jalur, ...params] = url.pathname.toLowerCase().replace(/^\//, '').split('/');
biarkan lokasi = menunggu env.REDIRECTS.get(path);
jika (lokasi) {
// Ganti placeholder dengan parameter sebenarnya
params.forEach((param, indeks) => {
lokasi = lokasi.replace(`{${index}}`, param);
});
return Response.redirect(lokasi, 301);
}
return Respon baru(`Tidak Ditemukan: ${path}`, { status: 404 });
},
};
Dengan pengaturan ini, Anda dapat memiliki entri KV seperti “produk” : “https://mystore.com/item/{0}/details” dan menggunakannya sebagai yourshortlink.com/product/12345.
Klik Pelacakan dan Analisis
Terapkan analisis dasar dengan mencatat peristiwa pengalihan:
ekspor default {
async ambil(permintaan, env) {
const url = URL baru(permintaan.url);
const path = url.pathname.toLowerCase().replace(/^\//, '').split('/')[0];
lokasi const = menunggu env.REDIRECTS.get(path);
jika (lokasi) {
// Catat peristiwa pengalihan
menunggu env.REDIRECTS.put(`${path}_clicks`, (parseInt(menunggu env.REDIRECTS.get(`${path}_clicks`) || '0') + 1).toString());
return Response.redirect(lokasi, 301);
}
return Respon baru(`Tidak Ditemukan: ${path}`, { status: 404 });
},
};
Halaman Kesalahan Kustom
Alih-alih respons 404 teks biasa, kembalikan halaman HTML khusus:
const notFoundPage = `
Tautan Tidak Ditemukan
body {font-keluarga: Arial, sans-serif; perataan teks: tengah; padding-atas: 50 piksel; }
Ups! Tautan Tidak Ditemukan
Tautan pendek yang Anda cari tidak ada.
`;
// Dalam fungsi pengambilan Anda:
kembalikan Respons baru(notFoundPage, {
status: 404,
headers: { 'Jenis Konten': 'teks/html' }
});
tingkat Membatasi
Menerapkan pembatasan tarif dasar untuk mencegah penyalahgunaan:
ekspor default {
async ambil(permintaan, env) {
const ip = request.headers.get('CF-Connecting-IP');
const rateLimitKey = `ratelimit:${ip}`;
const currentRequests = parseInt(menunggu env.REDIRECTS.get(rateLimitKey) || '0');
if (currentRequests > 100) {// Batas 100 permintaan per menit
return new Response('Batas nilai terlampaui', { status: 429 });
}
menunggu env.REDIRECTS.put(rateLimitKey, (currentRequests + 1).toString(), {expirationTtl: 60});
// Logika pengalihan lainnya di sini
},
};
Pengujian A / B
Terapkan pengujian A/B sederhana untuk pengalihan Anda:
ekspor default {
async ambil(permintaan, env) {
const url = URL baru(permintaan.url);
const path = url.pathname.toLowerCase().replace(/^\//, '').split('/')[0];
const locationA = menunggu env.REDIRECTS.get(`${path}_A`);
const locationB = menunggu env.REDIRECTS.get(`${path}_B`);
if (lokasiA && lokasiB) {
lokasi const = Matematika.acak() < 0.5 ? lokasiA : lokasiB;
return Response.redirect(lokasi, 301);
}
// Penggantian ke pengalihan normal jika pengujian A/B tidak disiapkan
lokasi const = menunggu env.REDIRECTS.get(path);
jika (lokasi) {
return Response.redirect(lokasi, 301);
}
return Respon baru(`Tidak Ditemukan: ${path}`, { status: 404 });
},
};
Penyesuaian dan perluasan ini menambah fungsionalitas signifikan pada sistem pengalihan massal Anda, menjadikannya lebih fleksibel, kuat, dan informatif. Masing-masing fitur ini dapat disempurnakan dan diperluas lebih lanjut berdasarkan kebutuhan spesifik dan kasus penggunaan Anda.
Ringkasan: Membuat Penyingkat Tautan Khusus dengan Cloudflare Workers
Sepanjang postingan blog ini, kami telah menjelajahi cara membuat penyingkat URL khusus yang kuat dan fleksibel menggunakan Cloudflare Workers. Solusi ini menawarkan pendekatan gratis dan efisien untuk membuat tautan pendek dalam skala besar.
TL; DR:
- Cloudflare Workers menyediakan platform tanpa server untuk mengimplementasikan logika pengalihan khusus dengan distribusi global dan latensi rendah.
- Konfigurasi DNS yang tepat dan pengaturan Rute Pekerja sangat penting untuk menghubungkan domain kustom Anda ke Pekerja.
- Pekerja sederhana berbasis JavaScript dapat menangani skenario pengalihan yang kompleks secara efisien.
- Penyimpanan Key-Value (KV) Cloudflare dapat dimanfaatkan untuk membuat peta pengalihan yang dinamis dan mudah dikelola.
- Fitur-fitur canggih seperti pengalihan berparameter, pelacakan klik, halaman kesalahan khusus, pembatasan kecepatan, dan pengujian A/B dapat diterapkan dalam ekosistem Pekerja.
- Sistem ini menawarkan keunggulan signifikan dibandingkan sistem tradisional metode pengalihan, termasuk peningkatan kinerja, pengelolaan yang lebih mudah, dan peningkatan fleksibilitas.
Solusi yang kami buat menawarkan beberapa manfaat:
- Skalabilitas: Menangani jutaan pengalihan tanpa penurunan kinerja.
- keluwesan: Menambahkan, mengubah, atau menghapus pengalihan dengan mudah tanpa mengubah logika inti.
- Performance: Memanfaatkan jaringan global Cloudflare untuk pengalihan cepat ke seluruh dunia.
- Kustomisasi: Memungkinkan fitur lanjutan seperti analitik dan pengujian A/B.
- Efektivitas biaya: Memanfaatkan arsitektur tanpa server, yang berpotensi mengurangi biaya hosting.
- Alternatif gratis ke layanan populer seperti Bit.ly atau Yourls untuk membuat tautan pendek bermerek di domain khusus.
Kini setelah Anda memahami kekuatan dan fleksibilitas sistem pengalihan berbasis Cloudflare Worker ini, inilah saatnya untuk menerapkannya:
- Jika Anda belum melakukannya, daftar akun Cloudflare dan kenali platform Workers.
- Terapkan sistem ini untuk tautan pendek bermerek Anda sendiri atau pengalihan massal.
- Bereksperimenlah dengan fitur-fitur canggih yang telah kita diskusikan untuk menyesuaikan sistem dengan kebutuhan spesifik Anda.
- Bagikan pengalaman Anda atau ajukan pertanyaan di bagian komentar di bawah. Wawasan Anda dapat membantu orang lain di komunitas!
- Untuk kasus penggunaan lebih lanjut atau penerapan khusus, pertimbangkan untuk menghubungi pakar atau layanan konsultasi Cloudflare Workers.
Tetaplah penasaran, teruslah belajar, dan jangan ragu untuk melampaui batas dari apa yang mungkin dilakukan dengan alat seperti Cloudflare Workers.
