📘 תיעוד 233

שימוש בהעלאה ישירה עם אינטגרציה רציפה

עודכן לאחרונה: 18 בספטמבר 2026

Cloudflare Pages תומך בהעלאה ישירה של נכסים שנבנו מראש, ומאפשר להשתמש בשלבי בנייה מותאמים אישית ליישומים ולפרוס ל-Pages עם Wrangler. המדריך הזה ילמד איך לפרוס את היישום ל-Pages באמצעות אינטגרציה רציפה.

#פריסה עם Wrangler

בתיקיית הפרויקט, התקינו את Wrangler כדי שתוכלו לפרוס תיקייה של נכסים שנבנו מראש, על ידי הרצת הפקודה הבאה:

# Publish created project
$ CLOUDFLARE_ACCOUNT_ID=<ACCOUNT_ID> npx wrangler pages deploy <DIRECTORY> --project-name=<PROJECT_NAME>

#קבלת אישורים מ-Cloudflare

#יצירת אסימון API

כדי ליצור אסימון API:

1. בלוח הבקרה של Cloudflare, עברו לדף API Tokens. מעבר ל-Account API tokens
2. בחרו Create Token.
3. תחת Custom Token, בחרו Get started.
4. תנו שם לאסימון ה-API בשדה Token name.
5. תחת Permissions, בחרו Account, Cloudflare Pages ו-Edit:
6. בחרו Continue to summary > Create Token.

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

#קבלת מזהה החשבון של הפרויקט

כדי למצוא את מזהה החשבון, עברו לדף Zone Overview בלוח הבקרה של Cloudflare.

מעבר ל-Overview

מצאו את מזהה החשבון במקטע API בתפריט בצד ימין.

אם לא הוספתם zone, הוסיפו אחד על ידי בחירה ב-Add > Connect a domain. אפשר לרכוש דומיין מ-הרשם של Cloudflare.

#שימוש ב-GitHub Actions

GitHub Actions היא פלטפורמת אינטגרציה רציפה ואספקה רציפה (CI/CD) שמאפשרת להפוך את צינור הבנייה, הבדיקה והפריסה לאוטומטי כשמשתמשים ב-GitHub. אפשר ליצור workflows שבונים ובודקים כל pull request למאגר, או פורסים pull requests שמוזגו לייצור.

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

#הוספת אישורי Cloudflare לסודות של GitHub

ב-GitHub Action שהגדרתם, נדרשים משתני סביבה כדי לדחוף את הפרויקט אל Cloudflare Pages. כדי להוסיף את הערכים של משתני הסביבה האלה במאגר GitHub של הפרויקט:

1. עברו למאגר הפרויקט ב-GitHub.
2. מתחת לשם המאגר, בחרו Settings.
3. בחרו Secrets > Actions > New repository secret.
4. צרו סוד אחד ושימו CLOUDFLARE_ACCOUNT_ID כשם, והערך הוא מזהה חשבון Cloudflare שלכם.
5. צרו סוד נוסף ושימו CLOUDFLARE_API_TOKEN כשם, והערך הוא אסימון ה-API של Cloudflare.

הוסיפו את הערך של מזהה חשבון Cloudflare ושל אסימון ה-API של Cloudflare כ-CLOUDFLARE_ACCOUNT_ID ו-CLOUDFLARE_API_TOKEN, בהתאמה. זה יבטיח שהסודות האלה מאובטחים, ובכל פעם שה-Action רץ, הוא ייגש לסודות האלה.

#הגדרת workflow

צרו קובץ .github/workflows/pages-deployment.yaml בשורש הפרויקט. הקובץ .github/workflows/pages-deployment.yaml יכיל את ה-jobs שתציינו בבקשה, כלומר: on: [push] במקרה הזה. אפשר גם על pull request. להסבר מפורט על תחביר GitHub Actions, עיינו בתיעוד הרשמי.

בקובץ pages-deployment.yaml, העתיקו את התוכן הבא:

on: [push]
jobs:
  deploy:
    runs-on: ubuntu-latest
    permissions:
      contents: read
      deployments: write
    name: Deploy to Cloudflare Pages
    steps:
      - name: Checkout
        uses: actions/checkout@v6
      # Run your project's build step
      # - name: Build
      #   run: npm install && npm run build
      - name: Deploy
        uses: cloudflare/wrangler-action@v4
        with:
          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
          command: pages deploy YOUR_DIRECTORY_OF_STATIC_ASSETS --project-name=YOUR_PROJECT_NAME
          gitHubToken: ${{ secrets.GITHUB_TOKEN }}

בבלוק הקוד שלמעלה, הגדרתם Action שרץ כשדוחפים קוד למאגר. החליפו את YOUR_PROJECT_NAME בשם פרויקט Cloudflare Pages שלכם, ואת YOUR_DIRECTORY_OF_STATIC_ASSETS בתיקיית הפלט של הפרויקט, בהתאמה.

הביטוי ${{ secrets.GITHUB_TOKEN }} יסופק אוטומטית על ידי GitHub Actions עם ההרשאות contents: read ו-deployments: write. זה יאפשר ל-action של Cloudflare Pages שלנו ליצור Deployment בשמכם.

הערה

ה-workflow הזה מופעל אוטומטית על ענף ה-git הנוכחי, אלא אם מוסיפים אפשרות branch למקטע with.

#שימוש ב-CircleCI עבור CI/CD

CircleCI היא פלטפורמה נוספת לאינטגרציה רציפה ולאספקה רציפה (CI/CD) שמאפשרת להפוך את צינור הבנייה, הבדיקה והפריסה לאוטומטי. אפשר להגדיר אותה כך שתריץ ביעילות צינורות מורכבים עם caching, docker layer caching ו-resource classes.

בדומה ל-GitHub Actions, CircleCI יכול להשתמש ב-Wrangler כדי לפרוס את הפרויקטים ברציפות בכל פעם שדוחפים לקוד.

#הוספת אישורי Cloudflare ל-CircleCI

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

כדי להוסיף משתני סביבה, ביישום האינטרנט של CircleCI:

1. עברו לפרויקט Pages שלכם > Settings.
2. בחרו Projects בתפריט הצד.
3. בחרו את כפתור שלוש הנקודות (...) בשורת הפרויקט. תראו את האפשרות להוסיף משתני סביבה.
4. בחרו Environment Variables > Add Environment Variable.
5. הזינו את השם והערך של משתנה הסביבה החדש, שהם אישורי Cloudflare שלכם (CLOUDFLARE_ACCOUNT_ID ו-CLOUDFLARE_API_TOKEN).

#הגדרת workflow

צרו קובץ .circleci/config.yml בשורש הפרויקט. הקובץ הזה מכיל את ה-jobs שיופעלו לפי הסדר של ה-workflow. בקובץ config.yml, העתיקו את התוכן הבא:

version: 2.1
jobs:
  Publish-to-Pages:
    docker:
      - image: cimg/node:18.7.0

    steps:
      - checkout
      # Run your project's build step
      - run: npm install && npm run build
      # Publish with wrangler
      - run: npx wrangler pages deploy dist --project-name=<PROJECT NAME> # Replace dist with the name of your build folder and input your project name

workflows:
  Publish-to-Pages-workflow:
    jobs:
      - Publish-to-Pages

כשמשתמשים ב-CircleCI, תהליך האינטגרציה הרציפה מחולק ל-jobs. מבלוק הקוד שלמעלה אפשר לראות שקודם מגדירים רשימת jobs שרצים בכל commit. לדוגמה, המאגר ירוץ על תמונת docker שנבנתה מראש, cimg/node:18.7.0. קודם הוא עושה checkout למאגר עם גרסת Node שצוינה בתמונה.

הערה

Wrangler דורש גרסת Node של לפחות 16.17.0. חובה לשדרג את גרסת Node.js אם הגרסה נמוכה מ-16.17.0.

אפשר לשנות את פקודת Wrangler עם כל אפשרויות wrangler pages deploy.

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

#Travis CI עבור CI/CD

Travis CI הוא כלי אינטגרציה רציפה בקוד פתוח שמטפל במשימות מסוימות, כמו pull requests ודחיפות קוד, עבור תהליך העבודה של הפרויקט. אפשר לשלב את Travis CI בפרויקטי GitHub, במסדי נתונים ובשירותים מותקנים מראש אחרים שמופעלים בתצורת הבנייה. כדי להשתמש ב-Travis CI, צריך שיהיה לכם חשבון GitHub, Bitbucket, GitLab או Assembla.

#הוספת אישורי Cloudflare ל-TravisCI

בפרויקט Travis, הוסיפו את אישורי Cloudflare שיצרתם מלוח הבקרה של Cloudflare כדי לגשת אליהם בקובץ travis.yml. עברו ללוח הבקרה של Travis CI ובחרו את הפרויקט הנוכחי > More options > Settings > Environment Variables.

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

#הגדרה

עברו אל Travis-ci.com והפעילו את המאגר על ידי התחברות עם הספק המועדף. המדריך הזה משתמש ב-GitHub. אחר כך, צרו קובץ .travis.yml והעתיקו לתוכו את התוכן הבא:

language: node_js
node_js:
  - "18.0.0" # You can specify more versions of Node you want your CI process to support
branches:
  only:
    - travis-ci-test # Specify what branch you want your CI process to run on
install:
  - npm install

script:
  - npm run build # Switch this out with your build command or remove it if you don't have a build step
  - npx wrangler pages deploy dist --project-name=<PROJECT NAME>

env:
  - CLOUDFLARE_ACCOUNT_ID: { $CLOUDFLARE_ACCOUNT_ID }
  - CLOUDFLARE_API_TOKEN: { $CLOUDFLARE_API_TOKEN }

זה יגדיר את גרסת Node.js ל-18. הגדרתם גם את הענפים שעליהם האינטגרציה הרציפה תרוץ. לבסוף, הזינו את PROJECT NAME במקטע ה-script, ותהליך ה-CI אמור לעבוד כמצופה.

אפשר גם לשנות את פקודת Wrangler עם כל אפשרויות wrangler pages deploy.