نحوه ایجاد یک سایت ثابت در سایت های Cloudflare Workers

سلام! نام من دیما است، من یک رهبر فنی برای تیم SysOps در Wrike هستم. در این مقاله به شما خواهم گفت که چگونه در 10 دقیقه و 5 دلار در ماه یک وب سایت تا حد امکان به کاربر نزدیک کنید و راه اندازی آن را خودکار کنید. مقاله تقریباً هیچ ارتباطی با مشکلاتی که ما در تیم خود حل می کنیم ندارد. این بیشتر تجربه و برداشت شخصی من از آشنایی با فناوری است که برای من جدید است. من سعی کردم تا حد امکان مراحل را با جزئیات شرح دهم تا دستورالعمل ها برای افراد با تجربه های مختلف مفید باشد. امیدوارم خوشتان بیاید. برو!

بنابراین، شاید قبلاً یک راه ساده و ارزان برای میزبانی یک وب سایت پیدا کرده باشید. شاید حتی رایگان، همانطور که در این توضیح داده شده است مقاله عالی.

اما ناگهان شما هنوز حوصله دارید و می خواهید دنیای جدید و شجاع تکنولوژی را لمس کنید؟ فرض کنید به خودکارسازی استقرار فکر می کنید و می خواهید سرعت سایت خود را تا حد امکان افزایش دهید؟ در این مقاله استفاده خواهیم کرد هوگو، اما این اختیاری است.

ما از Gitlab CI/CD برای اتوماسیون استفاده می کنیم، اما شتاب چطور؟ بیایید سایت را مستقیماً با استفاده از Cloudflare مستقر کنیم سایت های کارگری.

آنچه برای شروع لازم است:

• Gitlab (خود شما یا ابری)

• حساب در Cloudflare

• نصب شده است nodejs/npm

قسمت 1: نصب هوگو

اگر از قبل Hugo را نصب کرده‌اید، یا اگر یک مولد سایت استاتیک متفاوت را ترجیح می‌دهید (یا اصلاً از آن استفاده نمی‌کنید)، می‌توانید از این بخش صرفنظر کنید.

1. دانلود Hugo از https://github.com/gohugoio/hugo/releases

2. فایل اجرایی Hugo را مطابق یکی از مواردی که در آن تعریف شده است قرار می دهیم PATH راه ها

3. ایجاد سایت جدید: hugo new site blog.example.com

4. دایرکتوری فعلی را به پوشه تازه ایجاد شده تغییر دهید: cd blog.example.com

5. انتخاب موضوع طراحی (https://github.com/budparr/gohugo-theme-ananke/releases یا هر چیز دیگری)

6. بیایید اولین پست را ایجاد کنیم: hugo new posts/my-amazing-post.md

7. اضافه کردن محتوا به فایل ایجاد شده: content/posts/my-amazing-post.md.
   وقتی همه چیز تمام شد، مقدار پیش نویس را به تغییر دهید غلط

8. تولید فایل های ثابت: hugo -D

اکنون سایت استاتیک ما در داخل یک فهرست قرار دارد ./عمومی و برای اولین استقرار دستی شما آماده است.

قسمت 2: راه اندازی Cloudflare

حالا بیایید به تنظیمات اولیه Cloudflare نگاه کنیم. بیایید فرض کنیم که در حال حاضر یک دامنه برای سایت داریم. بیایید به عنوان مثال blog.example.com.

مرحله 1: یک ورودی DNS ایجاد کنید

ابتدا دامنه ما و سپس آیتم منو را انتخاب کنید DNS. ما یک وبلاگ A-Record ایجاد می کنیم و مقداری IP ساختگی را برای آن نشان می دهیم (این رسمی است توصیه، اما می توانستند آن را کمی زیباتر کنند).

مرحله 2: توکن Cloudflare

1. پروفایل من -> توکن های API tab-> ایجاد توکن -> توکن سفارشی ایجاد کنید

در اینجا باید توکن را به حساب ها و مناطق محدود کنید، اما گزینه Edit را برای مجوزهای فهرست شده در تصویر بگذارید.

توکن را برای آینده ذخیره کنید، در قسمت سوم به آن نیاز خواهیم داشت.

مرحله 3: حساب کاربری و zoneid را دریافت کنید

دامنه → بررسی اجمالی → [نوار کناری سمت راست]

اینها مال من هستند لطفا از آنها استفاده نکنید :)

آنها را در کنار توکن ذخیره کنید، در قسمت سوم نیز به آنها نیاز خواهیم داشت.

مرحله 4: کارگران را فعال کنید

دامنه → کارگران → کارگران را مدیریت کنید

ما یک نام منحصر به فرد و تعرفه کارگران → نامحدود (5 دلار در ماه امروز) را انتخاب می کنیم. در صورت تمایل، می توانید بعداً به نسخه رایگان ارتقا دهید.

قسمت 3: استقرار اول (استقرار دستی)

من اولین استقرار دستی را انجام دادم تا بفهمم واقعاً در آنجا چه خبر است. اگرچه همه اینها را می توان ساده تر انجام داد:

1. wrangler را نصب کنید: npm i @cloudflare/wrangler -g

2. بیایید به دایرکتوری وبلاگ خود برویم: cd blog.example.com

3. راه اندازی wrangler: wrangler init — site hugo-worker

4. یک پیکربندی برای wrangler ایجاد کنید (در صورت درخواست، رمز را وارد کنید): wrangler config

حالا بیایید سعی کنیم تغییراتی در فایل ایجاد شده جدید ایجاد کنیم wrangler.toml (اینجا لیست کامل تنظیمات ممکن):

1. ما نشان می دهیم حسابدار و زونید

2. تغییر دادن مسیر به چیزی شبیه *blog.example.com/*

3. ما نشان می دهیم غلط برای workdev

4. سطل را به ./public تغییر دهید (یا جایی که سایت استاتیک شما قرار دارد)

5. اگر بیش از یک دامنه در مسیر دارید، باید مسیر را در اسکریپت کاری تصحیح کنید: Workers-site/index.js (به تابع مراجعه کنید handleEvent)

عالی است، وقت آن است که سایت را با استفاده از تیم مستقر کنید wrangler publish.

بخش 4: اتوماسیون استقرار

این راهنما برای Gitlab نوشته شده است، اما به طور کلی ماهیت و سهولت استقرار خودکار را نشان می دهد.

مرحله 1: پروژه ما را ایجاد و پیکربندی کنید

1. یک پروژه جدید GitLab ایجاد کنید و دایرکتوری سایت: را آپلود کنید blog.example.com با تمام محتویات باید در دایرکتوری ریشه پروژه قرار گیرد

2. تنظیم کردیم متغیر CFAPITOKEN اینجا: تنظیمات → CI / CD → متغیر

مرحله 2: یک فایل .gitlab-ci.yml ایجاد کنید و اولین استقرار را اجرا کنید

یک فایل ایجاد کنید .gitlab-ci.yml در ریشه با محتوای زیر:

stages:
  - build
  - deploy

build:
  image: monachus/hugo
  stage: build
  variables:
    GIT_SUBMODULE_STRATEGY: recursive
  script:
    - cd blog.example.com/
    - hugo
  artifacts:
    paths:
      - blog.example.com/public
  only:
    - master # this job will affect only the 'master' branch
  tags:
    - gitlab-org-docker #


deploy:
  image: timbru31/ruby-node:2.3
  stage: deploy
  script:
    - wget https://github.com/cloudflare/wrangler/releases/download/v1.8.4/wrangler-v1.8.4-x86_64-unknown-linux-musl.tar.gz
    - tar xvzf wrangler-v1.8.4-x86_64-unknown-linux-musl.tar.gz
    - cd blog.example.com/
    - ../dist/wrangler publish
  artifacts:
    paths:
      - blog.example.com/public
  only:
    - master # this job will affect only the 'master' branch
  tags:
    - gitlab-org-docker #

ما اولین استقرار را به صورت دستی راه اندازی می کنیم (CI/CD → خطوط لوله → اجرای خط لوله) یا با تعهد به شعبه اصلی. وویلا!

نتیجه

خب، ممکن است کمی آن را کم گفته باشم، و کل این پروسه کمی بیش از ده دقیقه طول کشید. اما اکنون شما یک سایت سریع با استقرار خودکار و چند ایده جدید در مورد کارهای دیگری که می توانید با Workers انجام دهید دارید.

 کارگران Cloudflare    هوگو    GitLab Ci

منبع: www.habr.com