چگونه یک لوکال سرور ران کنیم؟ اند مور

مقدمه

گاهی اوقات وقتی یک پروژه وب رو دانلود می‌کنیم و سعی میکنیم که اجراش کنیم بعضی عملکردها یا جزئیات سایت مثل عکس‌ها یا استایل‌ها درست نمایش داده نمی‌شوند و یا حتی فقط با یک صفحه سفید مواجه می‌شیم.اگر کنسول مرورگر (Browser console) را باز کنیم با خطاهایی مثل خطاهای زیر مواجه می‌شیم:

هنگام پیدا نکردن فایل
هنگام پیدا نکردن فایل

دلیل این خطا این است که مرورگر فایل‌های درخواستی کاربر را پیدا نمی‌کند؛ یکی از دلایلی که باعث به وجود آمدن این مشکل می‌شود، این است که طراح/برنامه نویسی که پروژه را درست کرده در زمان آدرس دهی‌ها، بجای آدرس‌دهی نسبی (relative) -آدرس‌دهی از فایل جاری- از آدرس‌دهی مطلق (absolute) -آدرس‌دهی از root پروژه- استفاده کرده است؛ چراکه در فایل‌های جاوااسکریپت (JavaScript) نمی‌توان از آدرس دهی نسبی استفاده کرد و فایل‌های لازم باید از فایل index.html که در نهایت همه فایل‌های جاوااسکریپت در آن مشخص و استفاده می‌شوند آدرس‌دهی شوند؛ از آنجایی که این کار در اکثر مواقع بسیار سخت است آدرس‌دهی‌ها به صورت مطلق انجام می‌شوند.

هنگام درخواست Ajax برای یک فایل
هنگام درخواست Ajax برای یک فایل

این خطا به این دلیل به وجود می‌آید که ارسال درخواست Ajax در پروتکل file -که برای دریافت فایل‌ها بدون وب سرور استفاده می‌شود- امکان پذیر نیست و فایل‌ها باید از طریق پروتلکل http/https که برای انتقال اطلاعات در بستر وب استفاده می‌شود دریافت شوند.

لوکال سرور

رابطه وب‌سرور و مرورگر
رابطه وب‌سرور و مرورگر

برای حل مشکلات فوق، باید از نرم‌افزارهای لوکال سرور استفاده کنیم. لوکال سرور یک برنامه وب‌سرور است که یک سرور برای تبادل داده طبق پروتکل HTTP روی سیستمی که اجرا می‌شود (معمولا در آدرس 127.0.0.1 سیستم که آدرس رزرو شده سیستم برای شبیه‌سازی اتصالات است و با آدرس زیر شناخته می‌شود) به وجود می‌آورد.

http://localhost

ایجاد یک لوکال سرور

برای ایجاد لوکال سرور روش‌های مختلفی وجود دارد که سعی می‌کنیم راحتترین‌های آنها را معرفی کنیم:

JavaScript -> lite-server

اگر روی سیستم خود Nodejs را نصب دارید، راحتترین روش برای ایجاد یک لوکال سرور استفاده از lite-server است. برای نصب دستور زیر را در ترمینال وارد می‌کنیم:

[sudo] npm i lite-server --global

پس از نصب برنامه، کافیست به فولدر پروژه رفته و یک پنجره ترمینال بازکرده و دستور زیر را بزنیم:

lite-server

حال -همانطور که در توضیحات چاپ شده پس از دستور نوشته شده- برنامه در آدرس زیر اجرا می‌شود:

http://localhost:3000

JavaScript -> http-server

ابزار جاوااسکریپتی دیگر برای ایجاد یک لوکال سرور http-server است که نحوه نصب و استفاده از آن مشابه قبل است:

[sudo] npm i -g http-server

Python -> SimpleHTTPServer

یکی دیگر از روش‌های ساده ایجاد یک لوکال سرور استفاده از ماژول SimpleHTTPServer پایتون است. برای استفاده از آن لازم است پایتون روی سیستم نصب باشد.برای راه اندازی سرور کافیست در فولدر پروژه خود یکی از دستورهای زیر را با توجه به ورژن پایتون خود استفاده کنید:

 python 2
[sudo] python -m SimpleHTTPServer 133
# python 3
[sudo] python3 -m http.server 133

PHP -> Built-in web server

روش دیگر برای ساخت لوکال سرور استفاده از وب‌سرور داخلی PHP است. برای استفاده کافیست در مسیر پروژه دستور زیر را وارد کنید تا پروژه در آدرس وارد شده سرو شده و قابل دسترس شود.

php -S localhost:8000


FENIX

نرم‌افزار سبک و سریع FENIX برای راه‌اندازی لوکال‌سرورهای مختلف با امکان اختصاص دادن آی‌پی پابلیک به پروژه‌ها برای دسترسی از خارج سیستم است؛ نحوه استفاده را اینجا بخوانید.

Stacks -> WAMP/XAMP/AMPPS/easyPHP

روش دیگر استفاده از یکی از محیط‌های توسعه php مانند WAMP، XAMP، AMPPS و یا easyPHP است که وب‌سروری داخلی برای اجرا در اختیار می‌گذارند.

انتشار صفحات وب پایا (Static web publishing)

علاوه بر استفاده از یک لوکال سرور و اجرای پروژه وب به وسیله آن‌ها می‌توان از یکی از برنامه‌های انتشار صفحات پایا (Static pages) مانند surge.sh و یا netlify استفاده کرد. در ادامه نحوه استفاده از surge توضیح داده می‌شود:

Surge.sh

دپلوی کردن یک پروژه وب با استفاده از این سرویس به سادگی وارد کردن یک دستور در ترمینال است؛ تنها کافیست از پیش Nodejs روی سیستم شما نصب باشد.

برای نصب surge دستور زیر را در ترمینال وارد می‌کنیم:

npm install --global surge

سپس برای دپلوی پروژه خود کافیست در مسیر پروژه دستور زیر را وارد کنیم:

surge

با وارد کردن این دستور از شما خواسته می‌شود که مسیر پروژه را تایید کنید. در صورت لزوم می‌توانید مسیر را تغییر داده و با فشردن دکمه enter آن‌را تایید کنید. سپس یک نام تصادفی برای پروژه انتخاب شده و برای تایید نمایش داده می‌شود که می‌توانید به آدرس دلخواه خود تغییر بدهید. فقط باید توجه کنید که نام دلخواه خود را قالب زیر وارد کنید:

[your-chosen-name].surge.sh

سپس با فشردن کلید enter پروژه آپلود شده و در آدرس انتخابی قابل دسترسی است.

دسترسی از خارج

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

ngrok

ngrok ابزاری برای ایجاد یک تونل به یکی از پورت‌های سیستم از طریق پروتکل‌های مختلف است که از SSL هم پشتیبانی می‌کند. برای استفاده پس از ثبت‌نام در سرویس و لاگین کردن کافیست همانند دستور زیر پروتکل و پورت مربوطه که هنگام سرو کردن پروژه انتخاب می‌کنید را وارد کنید تا یک IP پابلیک برای دسترسی به پروژه در نظر گرفته شود:

ngrok http 3000


localtunnel

ابزاری دیگری است که برای اینکار می‌توان استفاده کرد. برا ی استفاده از آن باید Nodejs روی سیستم شما نصب باشد.برای نصب آن از دستور زیر استفاده می‌کنیم:

npm install -g localtunnel

پس از نصب کافیست پروژه را در پورت دلخواه سرو کرده و با استفاده از دستور زیر به آن یک آی‌پی پابلیک اختصاص دهیم:

lt --port 3000