Ebben a bejegyzésben megosztom veletek hogyan hozhatja létre saját egyéni domain URL-rövidítőjét a Cloudflare Workers segítségével. Legyen szó webfejlesztőről, aki egy újabb eszközt szeretne hozzáadni a biztonsági övéhez, egy vállalkozás tulajdonosa, aki a linkjeit a borsos árcédula nélkül szeretné márkanevelni, vagy csak olyan valaki, aki szeret webes technológiákkal bíbelődni, ez a lépésenkénti útmutató te.
Webfejlesztőként és technológiai rajongóként mindig is lenyűgöztek azok az apróságok, amelyek hatékonyabbá és felhasználóbarátabbá teszik az internetet. Egy nap, amikor egy különösen hosszú és nehézkes URL-t megosztottam egy kollégámmal, azon kaptam magam, hogy egy egyszerű, személyre szabott módot szeretnék a hivatkozások lerövidítésére. Természetesen rengeteg URL-rövidítő szolgáltatás létezik, de valami olyasmit szerettem volna, ami jobban „én” – olyasmit, amit személyre szabhatok és irányíthatok.
Ekkor botlottam bele az ötletbe, hogy létrehozzam saját egyéni URL-rövidítőmet a Cloudflare Workers segítségével. Olyan volt, mintha egy rejtett kincset találnánk a webes technológiák hatalmas tengerében. Nem csak az URL-eket tudtam lerövidíteni, de saját domain nevemmel is megtehetem, ingyen! A felfedezés izgalma arra emlékeztetett, amikor először telepítettem egy webhelyet – az elhatalmasodás és a végtelen lehetőségek rohanását.
A felfedezést még izgalmasabbá tette az a felismerés, hogy fantasztikus, ingyenes alternatívaként szolgálhat az olyan népszerű szolgáltatásokkal szemben, mint a Bit.ly vagy a TinyURL, ha márkajelzéssel ellátott rövid linkeket hozhat létre egyéni domainen. Sok vállalkozás és magánszemély jó pénzt fizet az ilyen funkciókért, de itt van egy módja annak, hogy ugyanazt az eredményt érje el anélkül, hogy egy fillért költene.
1. lépés: Regisztráljon egy domain nevet (használjon rövid domaint)
Az egyéni URL-rövidítő létrehozásának első lépése egy domain név regisztrálása. Ez lesz a márkás rövid linkjei alapja, ezért válasszon okosan!
Íme néhány tipp a tökéletes domain kiválasztásához:
- Legyen rövid: Az URL-rövidítés lényege, hogy tömör linkeket hozzon létre. Ha lehetséges, keressen 3-5 karakteres domain neveket. Ez lehet egy rövidítés, mozaikszó vagy egy fülbemászó szó.
- Tedd emlékezetessé: Válasszon valamit, ami könnyen megjegyezhető és gépelhető. Ez megkönnyíti Önnek és másoknak a rövidített hivatkozások használatát.
- Vegye figyelembe a márkáját: Ha ezt üzleti vagy személyes márkához használja, próbálja meg összhangba hozni a domaint meglévő márkaidentitásával.
- Ellenőrizd az elérhetőséget: A rövid, fülbemászó domainek iránt nagy a kereslet. Előfordulhat, hogy kreatívnak kell lennie, vagy meg kell fontolnia az alternatív legfelső szintű domainek (TLD) használatát, például a .io, .co vagy .me, ha az első választása nem elérhető.
- Gondolj a TLD-re: Bár a .com népszerű, ne riadjon vissza más TLD-k elől. Néhány, például a .link vagy a .click, különösen alkalmas lehet URL-rövidítésre.
Íme néhány példa, amelyek inspirálhatnak:
- abc.link
- go.io
- shrt.co
- zap.me
Miután kiválasztotta domainjét, meg kell vásárolnia egy domainregisztrátortól. Néhány népszerű lehetőség:
- Namecheap
- Hajrá apa
- CloudFlare (Ajánlott – ami szintén nagyon kényelmes, mivel Cloudflare Workers-t fogunk használni)
Ne feledje, bár a domain pénzbe kerül, évente egyszeri vásárlás, az URL-rövidítő beállításának többi része pedig ingyenes lesz a Cloudflare Workers segítségével.
Profi tipp: A vásárlás véglegesítése előtt győződjön meg arról, hogy a domain nincs társítva spamhez vagy rosszindulatú tevékenységhez. Az előzményeket olyan eszközökkel ellenőrizheti, mint a Domain Tools vagy a Wayback Machine.
A fényes új domainnel a kezében készen áll a következő lépésre: a Cloudflare beállítására a domainhez. De ezzel foglalkozunk a következő részben.
2. lépés: Konfigurálja a DNS-rekordokat a domainhez
Most, hogy megvan a domainje, ideje beállítani a DNS-konfigurációt. Ez a lépés kulcsfontosságú annak biztosításához, hogy a Cloudflare Workers megfelelően működjön az újonnan regisztrált domainjével.
Nézzük végig a folyamatot:
1. Adja hozzá domainjét a Cloudflare-hez
- Ha még nem tetted meg, hozzon létre egy ingyenes Cloudflare-fiókot.
- A Cloudflare irányítópultján kattintson a „Webhely hozzáadása” elemre, és adja meg a domain nevét.
- A Cloudflare megkeresi a meglévő DNS-rekordokat. Törölje a talált rekordokat (kivéve, ha a domaint e-mailre vagy más fontos szolgáltatásokra is használja, ebben az esetben őrizze meg azokat).
2. Frissítse a névszervereket (hagyja figyelmen kívül ezt a lépést, ha domainje regisztrálva van a Cloudflare-nél)
- A Cloudflare névszervereket kínál Önnek.
- Nyissa meg domainregisztrátorának webhelyét, és cserélje le a meglévő névszervereket a Cloudflare által biztosítottakra.
- Ennek a lépésnek a globális terjedése akár 24 órát is igénybe vehet.
3. Állítsa be a DNS-rekordokat
- A Cloudflare DNS-beállításaiban két új A rekordot adunk hozzá.
- Adja hozzá a következőt:
Típus: A
Név: @
Tartalom: 192.0.2.1
TTL: kocsi
Proxy állapota: Meghatalmazott (narancssárga felhő - nagyon fontos)
Típus: A
Név: www
Tartalom: 192.0.2.1
TTL: kocsi
Proxy állapota: Meghatalmazott (narancssárga felhő - nagyon fontos)
Ez a 192.0.2.1 IP egy speciális „ál” cím. Dokumentációra és tesztelésre van fenntartva, így tökéletesen megfelel az igényeinknek.
4. Engedélyezze a Cloudflare Proxyt
- Győződjön meg arról, hogy a proxy állapota (narancssárga felhő ikon) engedélyezve van a DNS-rekordhoz.
- Ez lehetővé teszi a Cloudflare számára, hogy proxyszerezze a forgalmat, és ez szükséges a Cloudflare Workers működéséhez.
5. Ellenőrizze a konfigurációt
- Amint a névszerver változás elterjedt, a Cloudflare a domainjét „Aktív” állapotúként jeleníti meg.
- Ezt a Cloudflare irányítópultján ellenőrizheti.
A legfontosabb dolog itt az, hogy nem irányítjuk a domainjét semmilyen tényleges webtárhelyre. A 192.0.2.1 cím csak egy helyőrző. Az Ön Cloudflare Workerje, amelyet legközelebb beállítunk, elfog minden kérést a domainjéhez, és kezeli az URL-rövidítési logikát.
Profi tipp: Ez a beállítás azt jelenti, hogy nem kell fizetnie vagy kezelnie kell a webtárhelyet. A Cloudflare Workers megbirkózik minden nehéz emeléssel, így ez a megoldás nem csak ingyenes, hanem hihetetlenül könnyű és könnyen karbantartható is.
Ha a DNS megfelelően van konfigurálva, most készen áll az izgalmas részre – a Cloudflare Worker beállítása az URL-lerövidítés kezelésére.
3. lépés: Cloudflare Worker létrehozása
Most, hogy tartományunkat beállítottuk a Cloudflare-ben, ideje létrehozni az átirányításainkat kezelő dolgozót. A Cloudflare Workers kiszolgáló nélküli végrehajtási környezetet biztosít, amely lehetővé teszi számunkra, hogy a kódunkat a széleken, a felhasználók közelében futtassuk az optimális teljesítmény érdekében.
1. Hozzon létre egy Cloudflare Workert
- Hozzáférés a Dolgozók részhez:
- Jelentkezzen be a Cloudflare irányítópultjába.
- Az oldalsávról lépjen a „Munkások” részre.
- Kattintson a „Szolgáltatás létrehozása” lehetőségre, ha ez az első dolgozója, vagy a „Munkavállaló létrehozása” elemre, ha már vannak dolgozói.
- Nevezze el a dolgozóját:
- Válasszon egy leíró nevet a dolgozónak, például „bulk-redirects-handler”.
- Kattintson a „Szolgáltatás létrehozása” gombra a szerkesztőhöz való továbblépéshez.
- A Worker script megírása:
- A szerkesztőben cserélje ki az alapértelmezett kódot az átirányításkezelő szkriptre:
export alapértelmezett {
async fetch(request) {
const redirectMap = new Map([
["google", "https://www.google.com?subId1=google"],
["bing", "https://www.bing.com?subId1=bing"],
// Szükség szerint adjon hozzá további átirányításokat
]);
const url = new URL(request.url);
console.log("Teljes URL:", url.toString());
console.log("Gazdagépnév:", url.gépnév);
console.log("Elérési út:", url.elérési útnév);
legyen elérési út = url.elérési útnév.aLowerCase().replace(/^\//, '').split('/')[0];
if (url.hostname.includes('workers.dev')) {
elérési út = url.elérési útnév.kisbetű().replace(/^\//, '').split('/')[1] || '';
}
console.log("Feldolgozott elérési út:", elérési út);
const hely = redirectMap.get(elérési út);
console.log("Átirányítási hely:", hely);
// Változás 301-re az Állandó átirányításhoz
if (hely) {
return Response.redirect(location, 302);
}
// Ha a kérés nem szerepel a térképen, küldjön vissza egy 404-et vagy a kívánt tartalékot
return new Response(`Nem található: ${elérési út}`, { állapot: 404 });
},
}; - A forgatókönyv értelmezése:
- Meghatározzuk a redirectMap amely tartalmazza rövid útvonalainkat és a hozzájuk tartozó teljes URL-címeket.
["google", "https://www.google.com?subId1=google"],
yourshorturl.com/google átirányítja a -> https://www.google.com?subId1=google
["bing", "https://www.bing.com?subId1=bing"],
A yourshorturl.com/bing átirányít ide: -> https://www.bing.com?subId1=bing
- A szkript feldolgozza a bejövő kéréseket, kibontja az elérési utat, és ellenőrzi, hogy az megfelel-e valamelyik meghatározott átirányításunknak.
- Ha talál egyezést, akkor 302-es (ideiglenes átirányítást) ad vissza a megfelelő URL-re.
- Ha nem található egyezés, 404-es Nem található választ ad vissza.
- A dolgozó tesztelése:
- Használja a Cloudflare irányítópult „Gyorsszerkesztés” funkcióját a módosítások végrehajtásához és a dolgozó teszteléséhez.
- A mellékelt HTTP-tesztelő eszközzel szimulálhatja a kéréseket, és megnézheti, hogyan reagál a dolgozó.
- A dolgozó bevetése:
- Ha elégedett a tesztekkel, kattintson a „Mentés és üzembe helyezés” gombra, hogy működőképessé tegye a dolgozót.
- Munkavállalói útvonalak beállítása:
- Az üzembe helyezés után lépjen a dolgozó „Triggerek” lapjára.
- Adjon hozzá egy útvonalat, amely megfelel a domainjének, például *recommends.link/*.
- Ez biztosítja, hogy a domainhez intézett összes kérést ez a dolgozó kezelje.
- A beállítás ellenőrzése:
- Próbáljon meg elérni néhány átirányítási útvonalat (pl. https://recommends.link/url-shortener-guide), hogy az elvárásoknak megfelelően működjenek.
- A Cloudflare irányítópultján ellenőrizze a dolgozók naplóit, hogy megtekinthesse a konzol kimenetét, és ellenőrizze, hogy az elérési utak feldolgozása megfelelő-e.
4. lépés: További testreszabások (opcionális)
Dinamikus átirányítások a Cloudflare KV segítségével
Az átirányítási rendszerünk rugalmasabbá és könnyebben kezelhetőbbé tétele érdekében Cloudflare KV (Key-Value) tárhelyet használhatunk átirányításaink tárolására:
Hozzon létre egy KV névteret:
- A Cloudflare irányítópultján lépjen a Dolgozók > KV elemre. Kattintson a „Névtér létrehozása” lehetőségre, és nevezze el (pl. „REDIRECT_MAP”).
- Nyissa meg a Worker beállításait. A „KV Namespace Bindings” alatt adjon hozzá egy új összerendelést. Válassza ki a KV névterét, és adjon neki egy változónevet (pl. REDIRECTS).
export alapértelmezett {
async fetch(request, env) {
const url = new URL(request.url);
const elérési út = url.útvonalnév.kisbetű().replace(/^\//, '').split('/')[0];
const hely = env.REDIRECTS.get(path);
if (hely) {
return Response.redirect(location, 301);
}
return new Response(`Nem található: ${elérési út}`, { állapot: 404 });
},
}; Mostantól hozzáadhat, frissíthet vagy eltávolíthat átirányításokat a KV tároló módosításával a Worker kód megváltoztatása nélkül.
Paraméterezett átirányítások
Engedélyezze a dinamikus paraméterek használatát az átirányításokban:
export alapértelmezett {
async fetch(request, env) {
const url = new URL(request.url);
const [elérési út, ...params] = url.útvonalnév.aLowerCase().replace(/^\//, '').split('/');
let location = env.REDIRECTS.get(path);
if (hely) {
// Helyőrzők cseréje tényleges paraméterekre
params.forEach((param, index) => {
location = location.replace(`{${index}}`, param);
});
return Response.redirect(location, 301);
}
return new Response(`Nem található: ${elérési út}`, { állapot: 404 });
},
}; Ezzel a beállítással rendelkezhet egy KV bejegyzéssel, például „product” : „https://mystore.com/item/{0}/details”, és használhatja yourshortlink.com/product/12345.
Kattintson a Nyomon követés és elemzés elemre
Valósítsa meg az alapvető elemzéseket az átirányítási események naplózásával:
export alapértelmezett {
async fetch(request, env) {
const url = new URL(request.url);
const elérési út = url.útvonalnév.kisbetű().replace(/^\//, '').split('/')[0];
const hely = env.REDIRECTS.get(path);
if (hely) {
// Az átirányítási esemény naplózása
await env.REDIRECTS.put(`${path}_clicks`, (parseInt(vára env.REDIRECTS.get(`${path}_clicks`) || '0') + 1).toString());
return Response.redirect(location, 301);
}
return new Response(`Nem található: ${elérési út}`, { állapot: 404 });
},
}; Egyéni hibaoldalak
Egyszerű szöveges 404-es válasz helyett egyéni HTML-oldalt adjon vissza:
const notFoundPage = `
Link nem található
body { font-family: Arial, sans-serif; szöveg igazítása: középre; padding-top: 50px; }
Hoppá! Link nem található
A keresett rövid link nem létezik.
`;
// A lekérési függvényben:
return new Response(notFoundPage, {
állapot: 404,
fejlécek: { 'Content-Type': 'text/html' }
});
sebesség korlátozás
A visszaélések megelőzése érdekében hajtsa végre az alapdíjkorlátozást:
export alapértelmezett {
async fetch(request, env) {
const ip = request.headers.get('CF-Connecting-IP');
const rateLimitKey = `ratelimit:${ip}`;
const currentRequests = parseInt(várakozik env.REDIRECTS.get(rateLimitKey) || '0');
if (currentRequests > 100) { // 100 kérés percenkénti korlát
return new Response('Túllépte a sebességhatárt', { status: 429 });
}
várjon env.REDIRECTS.put(rateLimitKey, (currentRequests + 1).toString(), {expirationTtl: 60});
// Az átirányítási logika többi része itt
},
}; A / B tesztelés
Végezzen egyszerű A/B tesztelést az átirányításokhoz:
export alapértelmezett {
async fetch(request, env) {
const url = new URL(request.url);
const elérési út = url.útvonalnév.kisbetű().replace(/^\//, '').split('/')[0];
const locationA = várjon env.REDIRECTS.get(`${path}_A`);
const locationB = várjon env.REDIRECTS.get(`${path}_B`);
if (hely A && helyB) {
const hely = Math.random() < 0.5 ? helyA : helyB;
return Response.redirect(location, 301);
}
// Visszatérés a normál átirányításra, ha nincs beállítva az A/B teszt
const hely = env.REDIRECTS.get(path);
if (hely) {
return Response.redirect(location, 301);
}
return new Response(`Nem található: ${elérési út}`, { állapot: 404 });
},
}; Ezek a testreszabások és bővítések jelentős funkciókkal bővítik a tömeges átirányítási rendszert, rugalmasabbá, hatékonyabbá és informatívabbá téve azt. Ezen funkciók mindegyike tovább finomítható és bővíthető az Ön egyedi igényei és használati esetei alapján.
Összegzés: Egyéni hivatkozásrövidítő létrehozása a Cloudflare Workers segítségével
Ebben a blogbejegyzésben azt vizsgáltuk, hogyan hozhatunk létre hatékony és rugalmas egyéni URL-rövidítőt a Cloudflare Workers segítségével. Ez a megoldás ingyenes és hatékony megközelítést kínál a rövid hivatkozások létrehozásához.
TL; DR:
- A Cloudflare Workers szerver nélküli platformot biztosít az egyéni átirányítási logika megvalósításához globális terjesztéssel és alacsony késleltetéssel.
- A megfelelő DNS-konfiguráció és a Worker Routes beállítása kulcsfontosságú az egyéni tartomány és a Worker összekapcsolásához.
- Egy egyszerű JavaScript-alapú Worker hatékonyan tudja kezelni az összetett átirányítási forgatókönyveket.
- A Cloudflare Key-Value (KV) tárolója dinamikus, könnyen kezelhető átirányítási térképek létrehozásához használható.
- Speciális funkciók, például paraméterezett átirányítások, kattintáskövetés, egyéni hibaoldalak, sebességkorlátozás és A/B tesztelés megvalósíthatók a Worker ökoszisztémán belül.
- Ez a rendszer jelentős előnyöket kínál a hagyományoshoz képest átirányítási módszerek, beleértve a jobb teljesítményt, a könnyebb kezelést és a fokozott rugalmasságot.
Az általunk kifejlesztett megoldás számos előnnyel jár:
- skálázhatóság: Több millió átirányítást kezel a teljesítmény romlása nélkül.
- Rugalmasság: Könnyen hozzáadhat, módosíthat vagy eltávolíthat átirányításokat az alapvető logika megváltoztatása nélkül.
- teljesítmény: A Cloudflare globális hálózatát használja a gyors átirányításokhoz világszerte.
- Testreszabás: Speciális funkciókat tesz lehetővé, mint például az elemzés és az A/B tesztelés.
- Költséghatékonyság: Szerver nélküli architektúrát használ, ami potenciálisan csökkenti a tárhely költségeit.
- Ingyenes alternatíva olyan népszerű szolgáltatásokhoz, mint a Bit.ly vagy Yourls márkás rövid hivatkozások létrehozásához egyéni domainen.
Most, hogy megértette ennek a Cloudflare Worker-alapú átirányítási rendszernek az erejét és rugalmasságát, itt az ideje, hogy működésbe hozza:
- Ha még nem tette meg, regisztráljon egy Cloudflare-fiókra, és ismerkedjen meg a Workers platformmal.
- Valósítsa meg ezt a rendszert saját márkás rövid linkjeihez vagy tömeges átirányításaihoz.
- Kísérletezzen az általunk tárgyalt fejlett funkciókkal, hogy a rendszert az Ön egyedi igényeihez szabhassa.
- Ossza meg tapasztalatait, vagy tegye fel kérdéseit az alábbi megjegyzések részben. Meglátásai segíthetnek másoknak a közösségben!
- Haladóbb használati esetek vagy egyedi megvalósítások esetén vegye fel a kapcsolatot egy Cloudflare Workers szakértővel vagy tanácsadói szolgáltatással.
Maradjon kíváncsi, tanuljon tovább, és ne habozzon feszegetni az olyan eszközök határait, mint a Cloudflare Workers.
