הוספת Firebase לשירות האינטרנט

מזהה אזור

‫REGION_ID הוא קוד מקוצר ש-Google מקצה על סמך האזור שבוחרים כשיוצרים את האפליקציה. הקוד לא תואם למדינה או למחוז, למרות שחלק ממזהי האזורים עשויים להיראות דומים לקודים נפוצים של מדינות ומחוזות. באפליקציות שנוצרו אחרי פברואר 2020, REGION_ID.r נכלל בכתובות URL של App Engine. באפליקציות קיימות שנוצרו לפני התאריך הזה, מזהה האזור הוא אופציונלי בכתובת ה-URL.

מידע נוסף על מזהי אזורים

מוסיפים את Firebase ל Google Cloud פרויקט, מגדירים את הגדרות האימות ואז מוסיפים את Firebase לשירות האינטרנט.

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

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

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

מתחילים מהמאמר פיתוח אפליקציה ב-Python 3 ומשלימים את כל השלבים עד לשלב הזה.
אם כבר יש לכם Google Cloud פרויקט, אתם יכולים להמשיך ולהוריד עותק של שירות האינטרנט:
1. מורידים את מאגר האפליקציה לדוגמה באמצעות Git:
```
git clone https://github.com/GoogleCloudPlatform/python-docs-samples
```
  אפשרות נוספת היא להוריד את הדוגמה כקובץ ZIP ואז לחלץ אותה.
2. עוברים אל הספרייה שמכילה עותק של הקבצים מהשלב הקודם:
```
cd python-docs-samples/appengine/standard_python3/building-an-app/building-an-app-1
```

הוספת Firebase לפרויקט Google Cloud

כדי להשתמש באימות ב-Firebase בשירות האינטרנט שלכם, צריך להוסיף את Firebase ל Google Cloud פרויקט ולהגדיר את הגדרות האימות.

מוסיפים את Firebase לפרויקט Google Cloud הקיים באמצעות הכלי הוספת פרויקט במסוף Firebase.

אפשר גם להשתמש בחשבון Firebase עם שם אחר, שלא משויך לפרויקט הקיים Google Cloud .
מפעילים את ספקי הכניסה לאימות במסוף Firebase. בשירות האינטרנט הזה, תפעילו את ספקי הכניסה Email/Password ו-Google:
1. לוחצים על Build (פיתוח) > Authentication (אימות) > Sign-in method (שיטת כניסה).
2. בקטע ספקי כניסה, בוחרים באפשרות אימייל/סיסמה.
3. מעבירים את הלחצן הפעלה למצב מופעל כדי להשתמש באימות באמצעות כתובת אימייל וסיסמה, ולוחצים על שמירה.
  
  טיפ: מידע נוסף על הפעלת ספקים אחרים זמין בקטעים 'לפני שמתחילים' במדריכים של Google,‏ Facebook,‏ Twitter ו-GitHub ב-Firebase.
כדי ש-Firebase יבצע אימות בצורה תקינה, צריך לאשר את הדומיין להפניות אוטומטיות של OAuth. כדי לאשר את הדומיין:
1. בוחרים באפשרות Build (בנייה) > Authentication (אימות) > Settings (הגדרות).
2. בקטע דומיינים מורשים בדף הגדרות, לוחצים על הוספת דומיין.
3. מזינים את הדומיין של האפליקציה ב-App Engine, לא כולל הקידומת http://:
  
  ‫PROJECT_ID. REGION_ID.r.appspot.com כאשר PROJECT_ID הוא מזהה הפרויקט ב-Google Cloud .

הוספת Firebase לשירות האינטרנט

כדי להוסיף את Firebase לשירות האינטרנט, מעתיקים את קטע הקוד המותאם אישית של פרויקט Firebase, את קובצי ה-JavaScript ואת קובצי ה-CSS אל שירות האינטרנט:

נכנסים אל מסוף Firebase ובוחרים את הפרויקט.
בדף סקירה כללית של הפרויקט, מתחת לטקסט Get started by adding Firebase to your app (מתחילים בהוספת Firebase לאפליקציה), בוחרים באפשרות web (אינטרנט). אם כבר הוספתם אפליקציה לפרויקט, יכול להיות שהטקסט הזה לא יופיע. במקום זאת, תצטרכו לעבור אל Project Overview (סקירת הפרויקט) > Project settings (הגדרות הפרויקט) > הדף General (כללי) של האפליקציה הקיימת, לגלול למטה ולבחור באפשרות Add app (הוספת אפליקציה).
אחרי שהאפליקציה נרשמת, מוצג קטע קוד מותאם אישית. מעתיקים את התוכן של קטע המידע. כדי לראות שוב את קטע הקוד הזה מאוחר יותר, עוברים לדף הגדרות הפרויקט של אפליקציית Firebase.

כדי לעדכן את הקובץ templates/index.html:

מוסיפים את השורות הבאות לתג <head>:

<script src="https://www.gstatic.com/firebasejs/ui/6.0.1/firebase-ui-auth.js"></script>
<link type="text/css" rel="stylesheet" href="https://www.gstatic.com/firebasejs/ui/6.0.1/firebase-ui-auth.css" />

מוסיפים את קטע הקוד המותאם אישית לתג <body>.

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

הקוד המותאם אישית ייראה בערך כמו קטע הקוד הבא:

<!-- MOCK SNIPPET: DO NOT COPY -->
<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/7.14.5/firebase-app.js"></script>

<!-- TODO: Add SDKs for Firebase products that you want to use
     https://firebase.google.com/docs/web/setup#available-libraries -->

<script>
  var config = {
    apiKey: "<API_KEY>",
    authDomain: "<PROJECT_ID>.firebaseapp.com",
    databaseURL: "https://<DATABASE_NAME>.firebaseio.com",
    projectId: "<PROJECT_ID>",
    storageBucket: "<BUCKET>.appspot.com",
    messagingSenderId: "<SENDER_ID>",
  };
  firebase.initializeApp(config);
</script>

מחליפים את הערך TODO בקטע הקוד שלמעלה בתג הסקריפט הבא כדי להפעיל את רכיב האימות של Firebase:
```
 <script src="https://www.gstatic.com/firebasejs/7.8.0/firebase-auth.js"></script>
 
```
כתובות הסקריפט האלה מתועדות במסמכי התיעוד של ממשק המשתמש של Firebase לאינטרנט.

מחליפים את שאר גוף הבקשה בקוד הבא, שבו תשתמשו בהמשך המדריך הזה כדי להציג נתונים של משתמשים מאומתים:

<div id="firebaseui-auth-container"></div>

<button id="sign-out" hidden=true>Sign Out</button>

<div id="login-info" hidden=true>
  <h2>Login info:</h2>
  {% if user_data %}
    <dl>
      <dt>Name</dt><dd>{{ user_data['name'] }}</dd>
      <dt>Email</dt><dd>{{ user_data['email'] }}</dd>
      <dt>Last 10 visits</dt><dd>
	{% for time in times %}
          <p>{{ time['timestamp'] }}</p>
        {% endfor %} </dd>
    </dl>
  {% elif error_message %}
    <p>Error: {{ error_message }}</p>
  {% endif %}
</div>

השלבים הבאים

אחרי שהוספתם את Firebase לפרויקט ולשירות האינטרנט שלכם, אתם יכולים להוסיף קוד לשירות האינטרנט כדי לאפשר לו לאמת משתמשים. Google Cloud

טיפול בנתונים

אימות משתמשים

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

מזהה אזור

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

הוספת Firebase לפרויקט Google Cloud

הוספת Firebase לשירות האינטרנט

השלבים הבאים

הוספת Firebase לשירות האינטרנט