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

לפני הפריסה באתר הפעיל, כדאי להציג ולבדוק את השינויים. Firebase Hosting מאפשר לך לראות ולבחון את השינויים באופן מקומי ולקיים אינטראקציה עם אמולציה של משאבי הפרויקט בקצה העורפי. אם אתם צריכים שחברי הצוות שלכם יראו לבדוק את השינויים שלך, Hosting יכול ליצור כתובות URL זמניות שניתנות לשיתוף עבור תצוגה מקדימה באתר שלך. אנחנו אפילו תומכים שילוב של GitHub לפריסה מ- pull. בקשה.

לפני שמתחילים

מבצעים את השלבים שמפורטים בדף Hosting תחילת העבודה, ובמיוחד את המשימות הבאות:

  1. מתקינים או מעדכנים את ה-CLI של Firebase לגרסה האחרונה.
  2. מקשרים את ספריית הפרויקט המקומית (הכוללת את תוכן האפליקציה) אל פרויקט Firebase.

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

שלב 1: בדיקה מקומית

אם אתם מבצעים איטרציות מהירות או שאתם רוצים שהאפליקציה תבצע אינטראקציה עם אמולציה את משאבי הפרויקט בקצה העורפי, אפשר לבדוק את התוכן וההגדרות של Hosting מקומית. כשבודקים באופן מקומי, אפליקציית האינטרנט שלכם מוצגת ב-Firebase בכתובת URL שמתארח באופן מקומי.

Hosting הוא חלק מ-Firebase Local Emulator Suite, שמאפשר לאפליקציה לקיים אינטראקציה עם תוכן באמולציה של Hosting config, וגם באופן אופציונלי את משאבי הפרויקט emulated (פונקציות, מסדי נתונים וכללים).

  1. (אופציונלי) כברירת מחדל, האפליקציה שמתארחת באופן מקומי מקיימת אינטראקציה עם תוכן מציאותי, לא emulated, לא משאבי הפרויקט (פונקציות, מסד נתונים, כללים וכו'). במקום זאת, אפשר גם לחבר את האפליקציה כדי להשתמש בכל פרויקט אמולציה המשאבים שהגדרתם. לקבלת מידע נוסף: Realtime Database | Cloud Firestore | Cloud Functions

  2. ברמה הבסיסית (root) של ספריית הפרויקט המקומית, מריצים את הפקודה הבאה:

    firebase emulators:start
  3. פותחים את אפליקציית האינטרנט בכתובת ה-URL המקומית שהוחזרה על ידי ה-CLI (בדרך כלל) http://localhost:5000).

  4. כדי לעדכן את השינויים בכתובת ה-URL המקומית, צריך לרענן את הדפדפן.

בדיקה ממכשירים מקומיים אחרים

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

"emulators": {
    // ...

    "hosting": {
      "port": 5000,
      "host": "0.0.0.0"
    }
  }

שלב 2: תצוגה מקדימה ושיתוף

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

אחרי הפריסה לערוץ תצוגה מקדימה, מערכת Firebase מציגה את אפליקציית האינטרנט 'preview URL', שהיא כתובת URL זמנית שניתן לשתף. כשמשתמשים בכתובת URL של תצוגה מקדימה, אפליקציית האינטרנט יוצרת אינטראקציה עם הקצה העורפי האמיתי של כל משאבי הפרויקט (למעט פונקציות 'מוצמדות' בתצורת ה-rewrites).

שים לב שלמרות שקשה לנחש כתובות אתר של תצוגה מקדימה (מכיוון שהן מכילות כתובת אתר אקראית hash), הם ציבוריים. כך שכל מי שיודע את כתובת ה-URL יכול לגשת אליה.

  1. ברמה הבסיסית (root) של ספריית הפרויקט המקומית, מריצים את הפקודה הבאה:

    firebase hosting:channel:deploy CHANNEL_ID

    מחליפים את הערך CHANNEL_ID במחרוזת ללא רווחים (לדוגמה, feature_mission-2-mars). המזהה הזה ישמש כדי ליצור כתובת האתר של התצוגה המקדימה המשויכת לערוץ של התצוגה המקדימה.

  2. פותחים את אפליקציית האינטרנט בכתובת ה-URL של התצוגה המקדימה שהוחזרה על ידי CLI. זה ייראה בערך כך: PROJECT_ID--CHANNEL_ID-RANDOM_HASH.web.app

  3. כדי לעדכן את כתובת ה-URL של התצוגה המקדימה בשינויים, מריצים שוב את אותה פקודה. יצרן חשוב לציין את אותו CHANNEL_ID בפקודה.

מידע נוסף על ניהול ערוצים של תצוגה מקדימה כולל הנחיות להגדרת תפוגת תוקף של ערוץ.

ב-Firebase Hosting יש תמיכה בפעולת GitHub שיוצרת מעדכנת כתובת URL של תצוגה מקדימה כשמבצעים שינויים בבקשת משיכה. כך מגדירים את GitHub Action הזו ומשתמשים בה.

שלב 3: פריסה בסביבה פעילה

כשתהיו מוכנים לשתף את השינויים שלכם עם העולם, תוכלו לפרוס את Hosting תוכן ותצורה לערוץ שלכם בשידור חי. ב-Firebase יש כמה דרכים אפשרויות לשלב הזה, בהתאם לתרחיש לדוגמה שלכם (ראו אפשרויות בהמשך).

אפשרות 1: שכפול מערוץ בתצוגה מקדימה לערוץ בשידור חי

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

  1. מכל ספרייה, מריצים את הפקודה הבאה:

    firebase hosting:clone SOURCE_SITE_ID:SOURCE_CHANNEL_ID TARGET_SITE_ID:live

    מחליפים כל placeholder בערך הבא:

    • SOURCE_SITE_ID ו-TARGET_SITE_ID: אלה המזהים של Hosting האתרים שמכילים את הערוצים.

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

      • בערוץ בשידור חי, מזהה הערוץ הוא live.
  2. מציגים את השינויים (השלב הבא).

אפשרות 2: פריסה מספריית הפרויקטים המקומית לערוץ בשידור חי

האפשרות הזו מספקת גמישות בהתאמת ההגדרות האישיות או לפרוס אותו גם אם לא השתמשתם בערוץ תצוגה מקדימה.

  1. מריצים את הפקודה הבאה מהשורש של ספריית הפרויקט המקומית:

    firebase deploy --only hosting
  2. מציגים את השינויים (השלב הבא).

שלב 4: הצגת השינויים באתר הפעיל

בשתי האפשרויות שלמעלה יש לפרוס את התוכן ואת ההגדרות ב-Hosting באתרים הבאים:

  • תתי-הדומיינים שהוקצו על ידי Firebase לאתר ברירת המחדל של Hosting, וגם כל אחד Hosting אתרים נוספים:
    SITE_ID.web.app (כמו PROJECT_ID.web.app)
    SITE_ID.firebaseapp.com (כמו PROJECT_ID.firebaseapp.com)

  • כל דומיין מותאם אישית שאליו התחברתם Hosting האתרים שלך

כדי להגביל את הפריסה לאתר Hosting ספציפי, ציון יעד פריסה בפקודה ב-CLI.

פעילויות פריסה אחרות ומידע

הוספת הערה לפריסה

אפשר גם להוסיף תגובה לפריסה. התגובה הזו תוצג עם נתוני פריסה נוספים מרכז הבקרה של Hosting במסוף Firebase. לדוגמה:

firebase deploy --only hosting -m "Deploying the best new feature ever."

הוספת משימות של סקריפטים לפני הפריסה ואחריה

אפשר גם לחבר סקריפטים של מעטפת לפקודה firebase deploy כדי לבצע משימות לפני פריסה ואחריה. לדוגמה, הוק (hook) לאחר פריסה יכול להודיע למנהלי המערכת על פריסות של תוכן אתר חדש. עיינו ב Firebaseמסמכי העזרה של CLI לקבלת פרטים נוספים.

שמירת תוכן שנפרס במטמון

כשנשלחת בקשה לתוכן סטטי, Firebase Hosting באופן אוטומטי מאחסנת את התוכן במטמון ב-CDN. אם פורסים מחדש את תוכן האתר, Firebase מנקה באופן אוטומטי את כל התוכן הסטטי שנשמר במטמון בכל ה-CDN, כדי בקשות מקבלות את התוכן החדש שלך.

שימו לב שאפשר להגדיר שמירה במטמון של תוכן דינמי.

הצגה באמצעות HTTPS

יש לוודא שכל המשאבים החיצוניים שלא מתארחים ב- Firebase Hosting נטענים באמצעות SSL (HTTPS),כולל סקריפטים חיצוניים. רוב הדפדפנים לא מאפשרים למשתמשים לטעון 'תוכן מעורב' (תנועה מסוג SSL ותנועה שאינה מסוג SSL).

מתבצעת מחיקה של הקבצים

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

השלבים הבאים