تنظیم Virtual Hosts در XAMPP و نظمی که به پروژه‌ها میده

چند روزیه که برای چند پروژه فعال در طراحان سفید نیاز به توسعه وب‌سرویس و API داریم. منم فرصت رو غنیمت شمردم و به جای اینکه یک یا دو نفر از بچه‌های فنی رو درگیر کنم، خودم رفتم سراغ کدنویسی و لذت‌های کدنویسی.

شاید براتون جالب باشه که بدونین چطور میشه مدیریت یک شرکت رو انجام داد و کارهای اجرایی و فنی رو هم ادامه داد؟! مدیریت یک تیم چند نفره که چند پروژه هم‌زمان هم کار می‌کنند خودش یک کار تمام وفته، منتهی ما در طراحان سفید به صورت تیمی کار مدیریت رو انجام می‌دیم و همین کار فرصتی برای من ایجاد کرده تا بتونم اون کاری که بیشتر دوست دارم رو هم دنبال کنم: کار فنی!

طبق معمولی اخلاق کاری خودم، قبل از شروع هر کاری یک work station دلخواه و جمع‌جور برای پروژه ایجاد کردم. مک‌بوک پرو و ترکیب Visual studio code و Dropbox و XAMPP و سیستم مدیریت نسخه دلخواه من Git تونست اون انعطاف‌پذیری و قدرتی که دوست داشتم رو برای من ایجاد کنه. فقط مونده بود چند تنظیم و تمام! همه چیز آماده شروع پروژه بود.

از دیگر مزیت‌های این ترکیب multi-platform بودن اونه. خیلی وقت‌ها میشه به دلیل مشغله‌های کاری بخوام ادامه کار رو در راه یا خانه انجام بدم و این یعنی work station باید همه جا درست کار کنه و صد البته کاملا Sync باشه.

فقط یک کار در مک‌بوک باقی‌مانده: تنظیم Virtual Hosts و اجرای کدها در یک server مجازی مجزا. من علاقه دارم پروژه‌ها رو در سرور‌های مجازی جداگانه نگهداری و تست می‌کنم. این کار مزیت‌هایی داره که یکی از اونها جلوگیری از افزونگی فایل‌های پروژه ست. همچنین چون برای پروژه‌ها دامنه مجزا تعریف می‌کنم، در هر سیستمی که ادامه کار رو انجام بدم، بدون نیاز به تغییرات کانفیگ پروژه کار رو میشه انجام داد.

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

در این پست از مقاله خوب جاناتان نیکول خیلی استفاده شده + تجربه‌های شخصی و چند ساعت درجا زدن برای حل خطاهای پیش اومده :)

ساخت Virtual Host
ساخت Virtual Host

مقدمه: Virtual Hosts چیست؟

در وب‌سرور Apache از Virtual Hosts (VH) برای مشخص کردن مسیر قرار گرفتن یک وب‌سایت روی سیستم محلی استفاده میشه. محدودیت خاصی در تعداد virtual host ها نیست و شما می‌تونین برای هر کدام از پروژه‌هایی که دارید یک آدرس مجزا تعریف کنید که به صورت مستقیم به محل ذخیره سایت شما روی filesystem اشاره می‌کنه.

برای مثال برای یک پروژه سایت رستوران، می‌تونیم به جای آدرسی مثل

 http://localhost/projects/resturant/public/

می‌تونین به سادگی و با تعریف VH با وارد کردن آدرسی مثل 

http://resturant.local

در مرورگر به سایت مدنظر دسترسی داشته باشید.

گام اول: فعال کردن Virtual Hosts برای Apache

معمولا به صورت پیش‌فرض امکان تعریف VH های سفارشی در xampp غیر فعاله. برای فعال کردن این امکان ابتدا فایل زیر رو بازی کنید:

/Applications/XAMPP/xamppfiles/etc/httpd.conf

سپس علامت # رو از ابتدای خط دوم بردارید تا این خط فعال (uncomment) بشه:

# Virtual hosts 
Include /Applications/XAMPP/etc/extra/httpd-vhosts.conf

این خط باید مشابه بالا باشه. فایل رو با این تنظیمات جدید save کنید.

گام دوم: ساخت Virtual Host

همه VHها در آپاچی در فایلی در مسیر زیر نگهداری میشن. برای ادامه کار باید این فایل رو مطابق اون چیزی که نیاز داریم ویرایش کنیم:

/Applications/XAMPP/xamppfiles/etc/extra/httpd-vhosts.conf

انتهای این فایل یک سری نمونه از VH ها هست که می‌تونین اونها رو پاک کنین (یا کامنت کنید با #)

قبل از اینکه هاست‌های خودمون رو تعریف کنیم، بهتره هاست پیش‌فرض localhost را هم تعریف کنیم تا اگر خواستیم از مسیر htdocs که ویژه xampp هست استفاده کنیم، مشکلی نداشته باشیم. برای اینکار این هاست رو به انتهای فایل اضافه کنید:

# localhost
<VirtualHost *:80>
    ServerName localhost
    DocumentRoot "/Applications/XAMPP/xamppfiles/htdocs"
        <Directory "/Applications/XAMPP/xamppfiles/htdocs">
            Options Indexes FollowSymLinks Includes execCGI
            AllowOverride All
            Require all granted
       </Directory>
</VirtualHost>

خب، حالا میشه هاست‌هایی که میخوایم رو هم اضافه کنیم. من برای این پروژه یک هاست می‌سازم به آدرس salema.local که مسیر اصلی اون منتهی میشه به پوشه work space همین پروژه در Dropbox. اینکه به جای یک آدرس com یا ir از پسوند local استفاده کردم به خاطر این بود که این هاست برای تست استفاده میشه و ممکنه با هاست اصلی پروژه که روی اینترنت قرار داره اشتباه گرفته بشه و باگ‌هایی برای من ایجاد کنه.

# Salema dev host
<VirtualHost *:80>
    ServerName salema.local
    ServerAlias salema.local *.salema.local    
    DocumentRoot "/users/sadegh/Dropbox/Salema/Server"
        <Directory "/users/sadegh/Dropbox/Salema/Server">
            Options Indexes FollowSymLinks Includes execCGI
            AllowOverride All
            Require all granted
       </Directory>
       ErrorLog "logs/salema.local-error_log"
</VirtualHost>

شما می‌تونین اسناد کامل Apache virtual hosts رو هم مطالعه کنید.

گام سوم: تنظیم فایل hosts

من هاستی که ساختم رو به دامنه salema.local متصل کردم. این دامنه به صورت پیش فرض در سیستم وجود نداره و برای اینکه کامپیوتر متوجه بشه این دامنه باید چه IP ای رو باز کنه، می‌تونیم فایل hosts رو ویرایش کنیم و اون رو به این فایل اضافه کنیم. خیلی راحت. اینجا قراره این دامنه به IP من یعنی 127.0.0.1 اشاره کنه.

فایل رو از مسیر زیر با یک ادیتور مثل sublime یا VS code و... باز کنید:

/etc/hosts

و سپس در انتهای این فایل عبارت زیر رو اضافه کنید:

127.0.0.1    salema.local

و فایل رو save کنید. تمام.

فقط حواستون باشه که این دامنه فقط در سیستم شما کار می‌کنه و اگه میخواین مثلا در یک سیستم دیگه هم با زدن این دامنه، هاست شما باز بشه باید یا در DNS سازمان‌تون این رو تعریف کنید یا اینکه در تمامی اون سیستم‌ها، فایل hosts رو ویرایش کنید.

گام چهارم: آپاچی رو Restart کنید

برای اینکه تنظیمات virtual hosts اعمال بشه، باید یکبار آپاچی سرور رو restart کنیم. خود xampp امکان مدیریت آپاچی رو داره که از طریق کنترل پنل این اپلیکیشن می‌تونین اون رو پیدا کنید:

/Applications/XAMPP/XAMPP Control.app

بعد از restart شدن آپاچی، دامنه رو در مرورگر وارد کنید و تست کنید که آیا درست کار می‌کنه؟ نه؟ خطاهای مرسوم:

  • خطای 404 server not found: یعنی فایل hosts درست ذخیره نشده یا IP درست تنظیم نشده. در واقع این دامنه در سیستم شما شناخته نمیشه. گام سوم رو درست انجام دادید؟
  • خطای 403 forbidden: وقتی که آپاچی اجازه دسترسی به مسیری که مشخص کردیم رو نداره. اینجا IP درسته ولی مشکلی در آپاچی هست که باید رفع کنیم.
  • مشکل نمایش صفحه پیش‌فرض xampp به جای صفحه اول هاست مجازی شما.



حل مشکل خطای ۴۰۳

این مشکل وقتی پیش میاد که آپاچی اجازه دسترسی به مسیرهایی که شما مدنظر دارید رو نداشته باشه. برای حل کردن این مشکل می‌تونین فایل زیر رو ویرایش کنین:

/Applications/XAMPP/xamppfiles/etc/httpd.conf

در بخش زیر، user رو با user خودتون در سیستم جایگزین کنید:

# User/Group: The name (or #number) of the user/group to run httpd as.
# It is usually good practice to create a dedicated user and group for
# running httpd, as with most system services.
#
User daemon
Group daemon

که مثلا بشه:

User your_user_name

بعد حتما آپاچی رو مجددا restart کنید.

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

حل مشکل نمایش صفحه پیش فرض Xampp

خب، من همه کارها رو انجام دادم و مطمئنم که همه چیز درست انجام شده ولی وقتی دامنه هاست رو وارد می‌کنم به جای مسیری که برای Document root دادم، صفحه پیش‌فرض xampp باز میشه... چه کنم؟

احتمالا به یک دلیلی سیستم شما داره به جای http از https برای باز کردن این هاست استفاده می‌کنه. درسته؟ اگر اینطوره، باید یک VH دیگه هم اضافه کنید که گوش به زنگ پورت ۴۴۳ و ارتباطات SSL باشه تا اگه درخواستی اومد متوجه بشه که مربوط به است هاسته:

<VirtualHost *:443>
    ServerName salema.local
    ServerAlias salema.local *.salema.local    
    DocumentRoot "/users/sadegh/Dropbox/Salema/Server"
    SSLEngine on
    SSLCertificateFile "/Applications/XAMPP/xamppfiles/etc/ssl.crt/server.crt"
    SSLCertificateKeyFile "/Applications/XAMPP/xamppfiles/etc/ssl.key/server.key"
    <Directory  "/users/sadegh/Dropbox/Salema/Server">
        Options Indexes FollowSymLinks Includes ExecCGI
        AllowOverride All
        Require all granted
    </Directory>
    ErrorLog "logs/salema.local-error_log"
    </VirtualHost>

اگر تمایل دارید برای ارتباط با هاستی که ساختید از SSL استفاده کنید هم می‌تونین از این روش استفاده کنید.


امیدوارم به دردتون بخوره :)