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

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

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

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

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

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

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

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

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

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

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

    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).

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

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

    firebase hosting:channel:deploy CHANNEL_ID

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

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

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

איך מנהלים ערוצי תצוגה מקדימה, כולל איך מגדירים את התוקף של הערוץ.

Firebase Hosting תומך ב-GitHub Action שיוצר ומעדכן באופן אוטומטי כתובת 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 לאחר הפריסה כדי להודיע לאדמינים על פריסות של תוכן חדש באתר. פרטים נוספים זמינים במסמכי התיעוד של CLI של Firebase.

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

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

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

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

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

מחיקת קבצים

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

השלבים הבאים