צור מקצר כתובת אתר מותאם אישית בחינם (עם Cloudflare Workers)

בפוסט הזה, אני הולך לשתף אתכם כיצד תוכל ליצור מקצר כתובות אתרים של דומיין מותאם אישית משלך באמצעות Cloudflare Workers. בין אם אתה מפתח אתרים שמעוניין להוסיף עוד כלי לחגורה שלך, בעל עסק שרוצה למתג את הקישורים שלך ללא תג המחיר הגבוה, או סתם מישהו שאוהב להתעסק עם טכנולוגיות אינטרנט, המדריך שלב אחר שלב מיועד עבור אַתָה.

כמפתח אתרים וחובב טכנולוגיה, תמיד הוקסמתי מהדברים הקטנים שהופכים את האינטרנט ליעיל וידידותי יותר למשתמש. יום אחד, בעודי חולקת כתובת URL ארוכה ומסורבלת במיוחד עם עמית, מצאתי את עצמי מייחלת לדרך פשוטה ומותאמת אישית לקיצור קישורים. בטח, יש הרבה שירותי קיצור כתובות אתרים בחוץ, אבל רציתי משהו שירגיש יותר "אני" - משהו שאוכל להתאים אישית ולשלוט בו.

אז נתקלתי ברעיון ליצור מקצר כתובות אתרים מותאם אישית משלי באמצעות Cloudflare Workers. זה היה כמו למצוא אוצר נסתר בים העצום של טכנולוגיות האינטרנט. לא רק שיכולתי לקצר כתובות אתרים, אלא שיכולתי לעשות זאת עם שם הדומיין שלי, בחינם! ההתרגשות מהגילוי הזה הזכירה לי את הפעם הראשונה שפרסתי אתר אינטרנט - את הבלאגן הזה של העצמה ואפשרויות אינסופיות.

מה שהפך את הגילוי הזה למרגש עוד יותר היה ההבנה שהוא יכול לשמש כחלופה פנטסטית וחינמית לשירותים פופולריים כמו Bit.ly או TinyURL ליצירת קישורים קצרים ממותגים בדומיין מותאם אישית. עסקים ואנשים פרטיים רבים משלמים כסף טוב עבור סוג זה של פונקציונליות, אבל הנה דרך להשיג את אותה תוצאה מבלי להוציא שקל.

שלב 1: רשום שם דומיין (השתמש בדומיין קצר)

השלב הראשון ביצירת מקצר כתובת האתר המותאם אישית שלך הוא רישום שם דומיין. זה יהיה הבסיס לקישורים הקצרים הממותגים שלך, אז בחר בחוכמה!

הנה כמה טיפים שיעזרו לך לבחור את הדומיין המושלם:

1. לשמור את זה קצר: כל המטרה של מקצר כתובות אתרים היא ליצור קישורים תמציתיים. חפש שמות דומיין עם 3-5 תווים אם אפשר. זה יכול להיות קיצור, ראשי תיבות או מילה קליטה.
2. הפוך את זה לבלתי נשכח: בחר משהו שקל לזכור ולהקליד. זה יקל עליך ואחרים להשתמש בקישורים המקוצרים שלך.
3. שקול את המותג שלך: אם אתה משתמש בזה עבור מותג עסקי או אישי, נסה ליישר את הדומיין עם זהות המותג הקיימת שלך.
4. בדוק זמינות: דומיינים קצרים וקליטים מבוקשים מאוד. ייתכן שתצטרך להיות יצירתי או לשקול דומיינים חלופיים ברמה העליונה (TLD) כמו .io, .co או .me אם הבחירה הראשונה שלך אינה זמינה.
5. תחשוב על ה-TLD: למרות ש-.com פופולרי, אל תירתע מ-TLD אחרים. חלקם, כמו .link או .click, עשויים להתאים במיוחד עבור מקצר כתובות אתרים.

הנה כמה דוגמאות שיתנו לך השראה:

• abc.link
• go.io
• shrt.co
• zap.me

לאחר שתבחר את הדומיין שלך, תצטרך לרכוש אותו מרשם דומיינים. כמה אפשרויות פופולריות כוללות:

• Namecheap
• קדימה אבא
• Cloudflare (מומלץ - וזה גם מאוד נוח מכיוון שנשתמש ב-Cloudflare Workers)

זכרו, בעוד שהדומיין יעלה כסף, מדובר ברכישה חד פעמית בשנה, ושאר הגדרות מקצר ה-URL שלנו יהיו בחינם באמצעות Cloudflare Workers.

טיפ מקצוען: לפני שתסיים את הרכישה, ודא שהדומיין אינו משויך לספאם או לפעילות זדונית. אתה יכול לבדוק את ההיסטוריה שלו באמצעות כלים כמו Domain Tools או Wayback Machine.

עם הדומיין החדש והנוצץ שלך ביד, אתה מוכן לעבור לשלב הבא: הגדרת Cloudflare עבור הדומיין שלך. אבל נסקור את זה בסעיף הבא.

שלב 2: הגדר את רשומות DNS עבור הדומיין שלך

עכשיו כשיש לך את הדומיין שלך, הגיע הזמן להגדיר את תצורת ה-DNS. שלב זה חיוני כדי להבטיח ש- Cloudflare Workers שלך יפעלו כהלכה עם הדומיין החדש שנרשם.

בואו נעבור על התהליך:

1. הוסף את הדומיין שלך ל-Cloudflare

• אם עדיין לא עשית זאת, צור חשבון Cloudflare בחינם.
• בלוח המחוונים של Cloudflare, לחץ על "הוסף אתר" והזן את שם הדומיין שלך.
• Cloudflare יסרוק לאיתור רשומות DNS קיימות. מחק את כל הרשומות שהוא מוצא (אלא אם כן אתה משתמש בדומיין גם עבור דואר אלקטרוני או שירותים חשובים אחרים, ובמקרה זה, שמור אותם).

2. עדכן שרתי שמות (התעלם משלב זה אם הדומיין שלך רשום ב-Cloudflare)

• Cloudflare תספק לך קבוצה של שרתי שמות.
• עבור אל אתר האינטרנט של רשם הדומיינים שלך והחלף את שרתי השמות הקיימים באלו שמסופקים על ידי Cloudflare.
• שלב זה עשוי להימשך עד 24 שעות להתפשטות גלובלית.

3. הגדר את רשומות DNS

• בהגדרות ה-DNS של Cloudflare שלך, נוסיף שתי רשומות A חדשות.
• הוסף את הדברים הבאים:

סוּג: A
שֵׁם: @
תוכן: 192.0.2.1
TTL: אוטומטי
סטטוס פרוקסי: פרוקסי (ענן כתום - חשוב מאוד)

סוּג: A
שֵׁם: www
תוכן: 192.0.2.1
TTL: אוטומטי
סטטוס פרוקסי: פרוקסי (ענן כתום - חשוב מאוד)

IP זה 192.0.2.1 הוא כתובת "דמה" מיוחדת. זה שמור לתיעוד ובדיקות, מה שהופך אותו מושלם לצרכים שלנו.

4. הפעל את Cloudflare Proxy

• ודא שסטטוס ה-proxy (סמל ענן כתום) מופעל עבור רשומת ה-DNS שלך.
• זה מאפשר ל-Cloudflare לבצע proxy של התעבורה שלך והכרחי ל-Cloudflare Workers לתפקד.

5. אמת את התצורה

• לאחר שהשינוי בשרת השמות התפשט, Cloudflare יציג את הדומיין שלך כ"פעיל".
• אתה יכול לאמת זאת בלוח המחוונים של Cloudflare.

נקודת המפתח כאן היא שאנחנו לא מפנים את הדומיין שלך לאירוח אתרים בפועל. כתובת 192.0.2.1 היא רק מציין מיקום. Cloudflare Worker שלך, אותו נגדיר בשלב הבא, יירט את כל הבקשות לדומיין שלך ויטפל בלוגיקה של קיצור כתובת האתר.

טיפ מקצוען: הגדרה זו אומרת שאינך צריך לשלם עבור או לנהל כל אירוח אתרים. Cloudflare Workers יתמודד עם כל ההרמה הכבדה, מה שהופך את הפתרון הזה לא רק בחינם אלא גם קל משקל וקל לתחזוקה להפליא.

עם ה-DNS שלך מוגדר כהלכה, אתה מוכן כעת לעבור לחלק המרגש - הגדרת Cloudflare Worker שלך לטיפול בקיצור כתובת האתר.

שלב 3: יצירת עובד Cloudflare

כעת, לאחר שהדומיין שלנו מוגדר ב-Cloudflare, הגיע הזמן ליצור את ה-Worker שיטפל בהפניות מחדש שלנו. Cloudflare Workers מספקים סביבת ביצוע ללא שרת המאפשרת לנו להריץ את הקוד שלנו בקצה, קרוב למשתמשים שלנו לביצועים מיטביים.

1. צור Cloudflare Worker

• גישה למדור העובדים:
  • היכנס ללוח המחוונים של Cloudflare שלך.
  • נווט אל הקטע "עובדים" מהסרגל הצדדי.
  • לחץ על "צור שירות" אם זה העובד הראשון שלך, או "צור עובד" אם כבר יש לך עובדים קיימים.
• תן שם לעובד שלך:
  • בחר שם תיאורי עבור ה-Worker שלך, כגון "הפניות בכמות גדולה".
  • לחץ על "צור שירות" כדי להמשיך לעורך.
• כתיבת תסריט העובד:
  • בעורך, החלף את קוד ברירת המחדל בסקריפט המטפל להפניה מחדש:

ברירת מחדל לייצא {
  async fetch(request) {
    const redirectMap = מפה חדשה([
      ["google"," https://www.google.com?subId1=google"],
      ["bing", "https://www.bing.com?subId1=bing"],
      // הוסף כאן הפניות מחדש לפי הצורך
    ]);

    const url = URL חדש(request.url);
    console.log("כתובת אתר מלאה:", url.toString());
    console.log("Hostname:", url.hostname);
    console.log("Pathname:", url.pathname);

    let path = url.pathname.toLowerCase().replace(/^\//, '').split('/')[0];
    
    if (url.hostname.includes('workers.dev')) {
      path = url.pathname.toLowerCase().replace(/^\//, '').split('/')[1] || '';
    }
    
    console.log("נתיב מעובד:", נתיב);
    
    const location = redirectMap.get(path);
    console.log("מיקום מחדש:", מיקום);

// שנה ל-301 עבור הפניה קבועה
    if (מיקום) {
      return Response.redirect(location, 302);
    }
    
    // אם הבקשה לא מופיעה במפה, החזר 404 או החזרה המועדפת עליך
    return new Response(`Not Found: ${path}`, { status: 404 });
  },
};

• הבנת התסריט:
  • אנו מגדירים א redirectMap שמכיל את הנתיבים הקצרים שלנו ואת כתובות האתרים המלאות המתאימות להם.

      ["google"," https://www.google.com?subId1=google"],

yourshorturl.com/google מפנה אל -> https://www.google.com?subId1=google

      ["bing", "https://www.bing.com?subId1=bing"],

yourshorturl.com/bing מפנה אל -> https://www.bing.com?subId1=bing

• הסקריפט מעבד בקשות נכנסות, מחלץ את הנתיב ובודק אם הוא תואם לאחת מההפניות מחדש המוגדרות שלנו.
• אם נמצאה התאמה, היא מחזירה 302 (הפניה זמנית) לכתובת האתר המתאימה.
• אם לא נמצא התאמה, הוא מחזיר תגובה 404 לא נמצא.
• בדיקת העובד:
  • השתמש בתכונת "עריכה מהירה" בלוח המחוונים של Cloudflare כדי לבצע שינויים ולבדוק את ה-Worker שלך.
  • אתה יכול להשתמש בכלי בדיקת ה-HTTP המסופק כדי לדמות בקשות ולראות כיצד ה-Werker שלך מגיב.
• פריסת העובד:
  • לאחר שתהיה מרוצה מהבדיקות שלך, לחץ על "שמור ופריסה" כדי להפעיל את ה-Werker שלך.
• הגדרת מסלולי עובדים:

• לאחר הפריסה, עבור לכרטיסייה "טריגרים" עבור ה-Worker שלך.
• הוסף מסלול התואם לדומיין שלך, כגון *recommends.link/*.
• זה מבטיח שכל הבקשות לדומיין שלך מטופלות על ידי עובד זה.
• אימות ההגדרה:
  • נסה לגשת לכמה מנתיבי ההפניה שלך (למשל, https://recommends.link/url-shortener-guide) כדי להבטיח שהם פועלים כמצופה.
  • בדוק את יומני העובדים בלוח המחוונים של Cloudflare שלך ​​כדי לראות את פלט המסוף ולוודא שהנתיבים מעובדים כהלכה.

שלב 4: התאמות אישיות נוספות (אופציונלי)

הפניות דינמיות עם Cloudflare KV

כדי להפוך את מערכת ההפניות שלנו לגמישה יותר וקלה יותר לניהול, אנו יכולים להשתמש באחסון Cloudflare KV (Key-Value) כדי לאחסן את ההפניות מחדש שלנו:

צור מרחב שמות KV:

• בלוח המחוונים של Cloudflare, עבור אל Workers > KV. לחץ על "צור מרחב שמות" ושם לו (למשל, "REDIRECT_MAP").

קשר את מרחב השמות של KV ל-Worker שלך:

• עבור להגדרות ה-Werker שלך. תחת "קבילות מרחב שמות KV", הוסף כריכה חדשה. בחר את מרחב השמות שלך KV ותן לו שם משתנה (למשל, REDIRECTS).

שנה את סקריפט ה-Worker כך שישתמש ב-KV:

   ברירת מחדל לייצא {
     async fetch(request, env) {
       const url = URL חדש(request.url);
       const path = url.pathname.toLowerCase().replace(/^\//, '').split('/')[0];
       
       const location = await env.REDIRECTS.get(path);
       
       if (מיקום) {
         return Response.redirect(location, 301);
       }
       
       return new Response(`Not Found: ${path}`, { status: 404 });
     },
   };

כעת תוכל להוסיף, לעדכן או להסיר הפניות מחדש על ידי שינוי חנות KV מבלי לשנות את קוד העובד.

הפניות מחדש עם פרמטרים

אפשר פרמטרים דינמיים בהפניות מחדש שלך:

   ברירת מחדל לייצא {
     async fetch(request, env) {
       const url = URL חדש(request.url);
       const [נתיב, ...params] = url.pathname.toLowerCase().replace(/^\//, '').split('/');
       
       let location = await env.REDIRECTS.get(path);
       
       if (מיקום) {
         // החלף מצייני מיקום בפרמטרים בפועל
         params.forEach((param, index) => {
           location = location.replace(`{${index}}`, param);
         });
         return Response.redirect(location, 301);
       }
       
       return new Response(`Not Found: ${path}`, { status: 404 });
     },
   };

עם הגדרה זו, תוכל לקבל ערך KV כמו "מוצר" : "https://mystore.com/item/{0}/details" ולהשתמש בו בתור yourshortlink.com/product/12345.

לחץ על מעקב וניתוח

יישם ניתוח בסיסי על ידי רישום אירועים להפניה מחדש:

   ברירת מחדל לייצא {
     async fetch(request, env) {
       const url = URL חדש(request.url);
       const path = url.pathname.toLowerCase().replace(/^\//, '').split('/')[0];
       
       const location = await env.REDIRECTS.get(path);
       
       if (מיקום) {
         // רישום את אירוע ההפניה מחדש
         await env.REDIRECTS.put(`${path}_clicks`, (parseInt(await env.REDIRECTS.get(`${path}_clicks`) || '0') + 1).toString());
         return Response.redirect(location, 301);
       }
       
       return new Response(`Not Found: ${path}`, { status: 404 });
     },
   };

דפי שגיאה מותאמים אישית

במקום תגובת 404 בטקסט פשוט, החזר דף HTML מותאם אישית:

   const notFoundPage = `
   
   
   
     
     
     קישור לא נמצא
     
       body { font-family: Arial, sans-serif; יישור טקסט: מרכז; ריפוד העליון: 50px; }
     
   
   
     אופס! קישור לא נמצא
     הקישור הקצר שאתה מחפש לא קיים.
   
   
   `;

   // בפונקציית האחזור שלך:
   החזר תגובה חדשה(notFoundPage, { 
     סטטוס: 404,
     כותרות: { 'Content-Type': 'text/html' }
   });

הגבלת קצב

יישם הגבלת תעריפים בסיסית כדי למנוע שימוש לרעה:

   ברירת מחדל לייצא {
     async fetch(request, env) {
       const ip = request.headers.get('CF-Connecting-IP');
       const rateLimitKey = `ratelimit:${ip}`;
       const currentRequests = parseInt(await env.REDIRECTS.get(rateLimitKey) || '0');
       
       if (currentRequests > 100) {// מגבלת 100 בקשות לדקה
         return new Response('חריגה ממגבלת השיעור', { status: 429 });
       }
       
       await env.REDIRECTS.put(rateLimitKey, (currentRequests + 1).toString(), {expirationTtl: 60});
       
       // שאר ההיגיון להפניה מחדש שלך כאן
     },
   };

A / B בדיקה

יישם בדיקות A/B פשוטות עבור ההפניות מחדש שלך:

   ברירת מחדל לייצא {
     async fetch(request, env) {
       const url = URL חדש(request.url);
       const path = url.pathname.toLowerCase().replace(/^\//, '').split('/')[0];
       
       const locationA = await env.REDIRECTS.get(`${path}_A`);
       const locationB = await env.REDIRECTS.get(`${path}_B`);
       
       if (locationA && locationB) {
         const location = Math.random() < 0.5 ? מיקוםA: מיקוםB;
         return Response.redirect(location, 301);
       }
       
       // חזרה להפניה רגילה אם מבחן A/B אינו מוגדר
       const location = await env.REDIRECTS.get(path);
       if (מיקום) {
         return Response.redirect(location, 301);
       }
       
       return new Response(`Not Found: ${path}`, { status: 404 });
     },
   };

ההתאמות וההרחבות הללו מוסיפות פונקציונליות משמעותית למערכת ההפניה מחדש בתפזורת שלך, והופכות אותה לגמישה, חזקה ואינפורמטיבית יותר. ניתן לשכלל ולהרחיב כל אחת מהתכונות הללו בהתבסס על הצרכים הספציפיים ומקרי השימוש שלך.

תקציר: יצירת מקצר קישורים מותאם אישית עם Cloudflare Workers

במהלך פוסט זה בבלוג, בדקנו כיצד ליצור מקצר כתובות URL מותאם אישית חזק וגמיש באמצעות Cloudflare Workers. פתרון זה מציע גישה חופשית ויעילה ליצירת קישורים קצרים בקנה מידה.

TL; DR:

1. Cloudflare Workers מספקים פלטפורמה ללא שרת להטמעת לוגיקה מותאמת אישית להפניה מחדש עם הפצה גלובלית והשהייה נמוכה.
2. תצורת DNS נכונה והגדרה של Worker Routes הם חיוניים לחיבור הדומיין המותאם אישית שלך ל-Werker.
3. Worker פשוט מבוסס JavaScript יכול להתמודד עם תרחישי הפניה מורכבים ביעילות.
4. ניתן למנף את האחסון Key-Value (KV) של Cloudflare ליצירת מפות הפנייה דינמיות וניתנות לניהול בקלות.
5. ניתן ליישם תכונות מתקדמות כמו הפניות מחדש עם פרמטרים, מעקב אחר קליקים, דפי שגיאה מותאמים אישית, הגבלת קצב ובדיקות A/B בתוך המערכת האקולוגית של Worker.
6. מערכת זו מציעה יתרונות משמעותיים על פני מסורתית שיטות הפניה מחדש, כולל ביצועים משופרים, ניהול קל יותר וגמישות מוגברת.

הפתרון שבנינו מציע מספר יתרונות:

• בקרת מערכות ותקשורת: מטפל במיליוני הפניות מחדש ללא פגיעה בביצועים.
• גמישות: הוסף, שנה או הסר בקלות הפניות מחדש מבלי לשנות את לוגיקה הליבה.
• ביצוע: ממנפת את הרשת הגלובלית של Cloudflare להפניות מהירה ברחבי העולם.
• התאמה אישית: מאפשר תכונות מתקדמות כמו ניתוח ובדיקות A/B.
• עלות תועלת: משתמש בארכיטקטורה ללא שרת, מה שעשוי להפחית את עלויות האירוח.
• חלופה חינם לשירותים פופולריים כמו Bit.ly או שלכם ליצירת קישורים קצרים ממותגים בדומיין מותאם אישית.

עכשיו כשאתה מבין את העוצמה והגמישות של מערכת ההפניה מבוססת Cloudflare Worker זו, הגיע הזמן להפעיל אותה:

1. אם עדיין לא עשית זאת, הירשם לחשבון Cloudflare והכיר את פלטפורמת Workers.
2. הטמע מערכת זו עבור קישורים קצרים ממותגים משלך או הפניות מחדש בכמות גדולה.
3. נסה עם התכונות המתקדמות שדנו בהן כדי להתאים את המערכת לצרכים הספציפיים שלך.
4. שתף את החוויות שלך או שאל שאלות בקטע ההערות למטה. התובנות שלך יכולות לעזור לאחרים בקהילה!
5. למקרי שימוש מתקדמים יותר או יישומים מותאמים אישית, שקול לפנות למומחה של Cloudflare Workers או לשירות ייעוץ.

הישארו סקרן, המשיכו ללמוד, ואל תהססו לפרוץ את הגבולות של מה שאפשר עם כלים כמו Cloudflare Workers.