پیش نمایش صفحات GitLab – انجمن DEV

وقتی پست‌های وبلاگ مرتبط با Apache APISIX را می‌نویسم، می‌خواهم همکارانم ابتدا آنها را بررسی کنند. با این حال، این وبلاگ من است، و از آنجایی که من پست های شخصی و تجاری را با هم ترکیب می کنم، می خواهم آنها را از مخزن نگه دارم. من به یک پیش نمایش نیاز دارم که فقط برای چند نفر قابل دسترسی باشد، چیزی شبیه پیش نمایش Vercel. من از GitLab Pages استفاده می کنم و چنین قابلیتی وجود ندارد.

من دو روش را امتحان کردم: GitHub gists و PDF. هر دو مشکل دارند

Gists به زیبایی صفحه آخر نمایش داده نمی شود. من سعی کردم با استفاده از DocGist وضعیت را بهبود بخشم. این یک بهبود است، حتی اگر نوشدارویی نباشد.

علاوه بر این، از زمانی که من پست‌هایم را در Asciidoc می‌نویسم، gists تصاویر را نمایش نمی‌دهند. من باید تصاویر را در نظرات تنظیم کنم، و این جریان را از بین می برد. من سعی کردم تصاویر را به اصل پیوست کنم، اما به هیچ وجه در جریان پست ظاهر نمی شوند. طرفدار بیش از نظرات این است که آنها سفارش داده شده است. مشکل این است که من باید Asciidoc را تغییر دهم.

من از gists استفاده کردم زیرا به بررسی های GitHub عادت کرده ام. اما از آنجایی که این وبلاگ من است، نه نیاز دارم و نه می خواهم به همان نوع بررسی هایی که در یک درخواست ادغام معمولی وجود دارد. من به افرادی نیاز دارم که وقتی چیزی باید روشن شود، یا من یک پرش منطقی را از دست دادم، به من اشاره کنند، نه اینکه اشتباه تایپی داشته باشم (من برای این کار از Grammarly استفاده می کنم). به همین دلیل، صادرات PDF یک پست برای بررسی کافی است.

با این حال، PDF ها به خودی خود دارای مشکلاتی هستند: یک “صفحه” وب به طور بالقوه بی پایان است، در حالی که یک صفحه PDF معمولی صفحه اول را به صفحات استاندارد برش می دهد. شکاف ها می توانند در نمودارها اتفاق بیفتند. علاوه بر این، فایل های PDF توزیع را بسیار سخت تر می کنند.

در این پست، نحوه پیکربندی صفحات GitLab را برای دریافت پیش نمایشی که می خواهم توضیح خواهم داد.

خلاصه صفحات GitLab

صفحات GitLab شبیه صفحات GitHub هستند:

با صفحات GitLab، می توانید وب سایت های ثابت را مستقیماً از یک مخزن در GitLab منتشر کنید.

برای انتشار یک وب‌سایت با صفحات، می‌توانید از هر مولد سایت ثابت مانند گتسبی، جکیل، هوگو، میدلمن، هارپ، هکسو یا برانچ استفاده کنید. همچنین می توانید هر وب سایتی را که مستقیماً با HTML، CSS و جاوا اسکریپت نوشته شده است منتشر کنید.

– صفحات GitLab

این پست وبلاگ را اینگونه می بینید. هیچ ویژگی پیش نمایشی برای صفحات GitLab پیدا نکردم. من از کارشناسان سوال کردم که فایده ای نداشت. GitLab پیش نمایش ارائه نمی دهد.

چیدمان کار

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

ایده این است که چنین مصنوعی ایجاد کنیم که تحت یک URL قابل دسترسی باشد، که به راحتی قابل پیش بینی نیست. سپس می‌توانم URL را با همکارانم به اشتراک بگذارم و از آنها نظر بخواهم. برای شروع، می‌توانیم نسخه موجود را کپی کنیم master:

stages:
  - preview

preview:
  stage: preview
  image:
    name: registry.gitlab.com/nfrankel/nfrankel.gitlab.io:latest
  before_script: cd /builds/nfrankel/nfrankel.gitlab.io
  script: bundle exec jekyll b --future -t --config _config.yml -d public
  artifacts:
    paths:
      - public
  only:
    refs:
      - preview
  variables:
    JEKYLL_ENV: production

در این مرحله، سایت در دسترس است https://$CI_PROJECT_NAMESPACE.gitlab.io/-/$CI_PROJECT_NAME/-/jobs/$CI_JOB_ID/artifacts/public/index.html. اگرچه بسیاری از مشکلات نیاز به رفع دارند.

به کار انداختن آن

بیایید مسائل را به ترتیب اهمیت حل کنیم.

رفع مجوزهای دسترسی

پروژه است خصوصی; از این رو، فقط من می توانم به مصنوع دسترسی داشته باشم: هدف اولیه ارائه پیش نمایش به دیگران را شکست می دهد.

من می خواهم به هم تیمی هایم دسترسی محدودی به مخزن GitLab خود بدهم. من به آنها دادم دسترسی مهمان، طبق اصل حداقل امتیاز. با این حال، هنوز کار نکرد.

طبق اسناد، باید خط لوله خود را نیز بسازید عمومی. به Settings > CI/CD > General pipelines بروید و چک باکس Public pipelines را علامت بزنید.

رفع پیوندهای نسبی

من از Jekyll برای ساخت HTML از Asciidoc استفاده می کنم. برای تولید پیوندها، جکیل از دو پارامتر پیکربندی استفاده می کند:

هر دو در پیش نمایش متفاوت هستند. شما باید آن پارامترها را در یک فایل پیکربندی YAML تنظیم کنید. هیچ جایگزین متغیر محیطی وجود ندارد.

بیایید بیلد را بر این اساس تغییر دهیم:

preview:
  stage: preview
  image:
    name: registry.gitlab.com/nfrankel/nfrankel.gitlab.io:latest
  before_script:
    - cd /builds/nfrankel/nfrankel.gitlab.io
    - "printf 'url: https://%s.gitlab.io\n' $CI_PROJECT_NAMESPACE >> _config_preview.yml"                        #1
    - "printf 'baseurl: /-/%s/-/jobs/%s/artifacts/public/\n' $CI_PROJECT_NAME $CI_JOB_ID >> _config_preview.yml" #2
    - cat _config_preview.yml                                                                                    #3
  script: bundle exec jekyll b --future -t --config _config.yml,_config_preview.yml -d public                    #4

1. تنظیم url با استفاده از CI_PROJECT_NAMESPACE متغیر محیطی. من می توانستم از یک مقدار کدگذاری شده استفاده کنم زیرا ثابت است، اما اسکریپت را قابل استفاده مجدد تر می کند
2. تنظیم baseurl با استفاده از CI_PROJECT_NAME و CI_JOB_ID متغیرهای محیطی. مورد دوم بخش تصادفی مورد نیاز است
3. نمایش محتوای پیکربندی برای اهداف اشکال زدایی
4. استفاده کن!

بهبود قابلیت استفاده

تلاش برای توزیع URL صحیح هر بار خسته کننده است. بهتر است بعد از ساخت آن را در کنسول یادداشت کنید:

after_script: echo https://$CI_PROJECT_NAMESPACE.gitlab.io/-/$CI_PROJECT_NAME/-/jobs/$CI_JOB_ID/artifacts/public/index.html

هنوز یک قطعه گم شده است صفحات GitLab یک صفحه فهرست ارائه می دهند. به عنوان مثال، اگر شما https://blog.frankel.ch را درخواست کنید، آنها روت را ارائه می دهند index.html. با مصنوعات ساده، اینطور نیست. با توجه به اینکه من فقط می خواهم یک پست را برای پیش نمایش ارائه کنم، مشکلی نیست، بنابراین بیشتر در مورد پیکربندی تحقیق نکردم.

استفاده

در این مرحله، من فقط باید به خودم فشار بیاورم preview شاخه:

git push --force origin HEAD:preview

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

نتیجه

در این پست، نحوه پیش‌نمایش صفحات GitLab و اشتراک‌گذاری URL پیش‌نمایش با هم تیمی‌ها را در چند مرحله نشان دادم. سخت ترین قسمت این بود که متوجه شوید مصنوعات وب به طور منظم با مرورگر ارائه می شوند.

فراتر رفتن:

در ابتدا در A Java Geek در 4 ژوئن منتشر شد^هفتم، 2023