עבד תשלומים עם Firebase

באמצעות כמה תכונות שונות של Firebase ו-Stripe, אתה יכול לעבד תשלומים באפליקציית האינטרנט שלך מבלי לבנות תשתית שרת משלך. מדריך זה ילווה אותך בהתאמה אישית ופריסה של גרסה משלך של אפליקציית הדוגמה של Cloud-functions-stripe-sample.web.app בקוד פתוח.

לפני שתתחיל, צור פרויקט במסוף Firebase והגדר חשבון Stripe .

סקירת יישום

  1. הגדר חשבון Stripe .
  2. צור פרויקט במסוף Firebase .
  3. הפעל חיוב עבור הפרויקט שלך והגדר את Firebase CLI להשתמש בפרויקט שלך עם firebase use --add .
  4. קבל את קוד המקור לאפליקציית Firestripe לדוגמה. הגדר אותו עם המידע המתאים עבור הפרויקט שלך והתאם אישית את הקוד כך שיתאים לאפליקציה שלך.
  5. לאחר שתפרוס את האפליקציה שלך, חפש רשימה של משתמשים ועסקאות במסוף Firebase.

הגדר ופריסה את האפליקציה לדוגמה

  1. קבל את קוד המקור .
  2. אפשר כניסה ל-Google ודוא"ל בהגדרות ספק האימות שלך.
  3. הפעל את Cloud Firestore .
  4. התקן את Firebase CLI אם עדיין לא עשית זאת, והתחבר עם firebase login .
  5. הגדר את הדוגמה הזו לשימוש בפרויקט שלך עם firebase use --add .
  6. התקן תלות מקומית על ידי הפעלת cd functions; npm install; cd -
  7. הוסף את המפתח הסודי של Stripe API לתצורת סביבת Cloud Functions שלך:

    firebase functions:config:set stripe.secret=<YOUR STRIPE SECRET KEY>

  8. הגדר את מפתח ה-Stripe הניתן לפרסום ב- /public/javascript/app.js :

    const STRIPE_PUBLISHABLE_KEY=<YOUR STRIPE PUBLISHABLE KEY>;

  9. פרוס את הפרויקט שלך באמצעות firebase deploy . הפקודה הזו:

    1. שולח את כל הקבצים בספרייה public אל Hosting כדי שהאתר שלך יהיה זמין.
    2. שולח את הקוד בספריית functions אל Cloud Functions for Firebase.
    3. מגדיר כללי אבטחה במסד הנתונים של Cloud Firestore שלך ​​כפי שהוגדר ב- firestore.rules . הכללים שסופקו רק מאפשרים למשתמש לקרוא ולכתוב את התשלומים ושיטות התשלום שלו.

בדוק את האפליקציה לדוגמה

בקר בכתובת האתר של אפליקציית התשלומים שלך בכתובת your-firebase-project-id.web.app וודא שהתכונות הבאות פועלות:

  • אתה יכול להיכנס דרך גוגל או אימייל.
  • אתה יכול להוסיף כרטיס בדיקת Stripe חדש ולהציג אותו ברכיב בחירת הכרטיס.
  • אתה יכול לבחור אחד מהכרטיסים שלך ולחייב אותו.
  • אתה יכול לצאת.

להשוואה, ראה cloud-functions-stripe-sample.web.app .

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

הצג תשלומים מעובדים

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

  1. עבור אל Cloud Firestore .
  2. בדוק אם יש רשימה של המשתמשים שלך, ואם הם הוסיפו כרטיסי אשראי או ביצעו עסקאות כלשהן, רשימה של אלה מתחת לכל משתמש.

קבל תשלומים חיים

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

  1. עדכן את תצורת ה-Stripe הסודית שלך:

    firebase functions:config:set stripe.secret=<YOUR STRIPE LIVE SECRET KEY>

  2. הגדר את המפתח הניתן לפרסום חי ב- /public/javascript/app.js .

  3. פרוס מחדש הן את פונקציות הענן והן את האחסון כדי שהשינויים ייכנסו לתוקף: firebase deploy .