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

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

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

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

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

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

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

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

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

  1. (אופציונלי) כברירת מחדל, האפליקציה שמתארחת באופן מקומי תקיים אינטראקציה עם משאבי פרויקט אמיתיים (פונקציות, מסד נתונים, כללים וכו'), ולא עם משאבים מדומה. אפשר גם לחבר את האפליקציה כדי להשתמש במשאבי פרויקט מדומה שהגדרתם. מידע נוסף: 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 מציג את אפליקציית האינטרנט בכתובת URL של תצוגה מקדימה, שהיא כתובת URL זמנית שאפשר לשתף. כשמשתמשים בכתובת URL של תצוגה מקדימה, אפליקציית האינטרנט מקיימת אינטראקציה עם ה-backend האמיתי שלכם עבור כל משאבי הפרויקט (למעט פונקציות מוצמדות בהגדרות של הכתיבה מחדש).

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

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

    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 לתצוגה מקדימה כשמבצעים commit של שינויים בבקשת משיכה. איך מגדירים את פעולת GitHub ומשתמשים בה

שלב 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. מהרמה הבסיסית (root) של ספריית הפרויקט המקומית, מריצים את הפקודה הבאה:

    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, הדרך העיקרית למחוק קבצים שנבחרו מאתר שפרסתם היא למחוק את הקבצים באופן מקומי ואז לפרוס מחדש.

השלבים הבאים