هر آنچه باید در رابطه با localhost بدانیم

توجه: این مقاله به مرور زمان، ویرایش و یا تکمیل می‌شود!
تقاضا: در صورتی که با مشکل تایپی، دستوری و یا مفهومی در این مقاله برخورد کردید، از شما دوست عزیز و گرامی، صمیمانه تقاضا می‌کنم که اینجانب را مطلع کرده، تا نسبت به تصحیح و یا تکمیل آن، در اسرع وقت، اقدام نمایم.
با کمال تشکر
امیرحسین امانی
کانال تلگرام: Amh_78@
نشانی پست الکترونیکی: a42464849@gmail.com

نسخه مقاله: ۱.۰ - تاریخ بروزرسانی: ۱۴۰۳/۰۶/۲۹

این مقاله برای چه کسانی مفید می‌باشد؟

این مقاله برای برنامه‌نویسان حوزه Web و خصوصا کسانی که در حوزه‌های ذیل برنامه‌نویسی می‌کنند، بسیار اهمیت داشته و مفید می‌باشد:

ASP.NET MVC

ASP.NET Web API

ASP.NET Core MVC

ASP.NET Core Web API

مقدمه

اجازه دهید که موضوع این مقاله را به صورت کاربردی و با مثال مطرح نمایم. همانطور که اکثر متخصصین در جریان هستند، تقریبا اکثر پروژه‌های وب به صورت دو بخشی طراحی و پیاده‌سازی می‌شوند. یعنی معمولا دو سایت ایجاد می‌شود. یکی به عنوان Backend بوده و معمولا با فنآوری Web API و یا Web API Core‌ پیاده‌سازی شده و یکی نیز به عنوان Frontend بوده و معمولا با فنآوری Vue, Angular, React, Blazor Web Assembly‌ و غیره پیاده‌سازی می‌شوند.

معمولا هر دو سایت نیز بر روی localhost و با یک port بالا می‌آیند.

فرض کنید که به عنوان مثال، نسخه Server و یا همان Backend بر روی آدرس‌های ذیل بالا بیایند:

Server:
http://localhost:15770
https://localhost:44322

و نیز فرض کنید که به عنوان مثال، نسخه Client و یا همان Frontend بر روی آدرس‌های ذیل بالا بیایند:

Client:
http://localhost:15771
https://localhost:44323

نکته: به http و https نشانی‌های فوق دقت نمایید!

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

حال مشکل چیست؟

اولین مشکل این است که مفهمومی مانند Cookie نمی‌تواند نسبت به Port های مختلف بر روی یک دامنه فرق قائل شود! و لذا اگر در داخل یکی از آن‌ها یک Cookie‌ ایجاد و استفاده نماییم، این Cookie‌ به صورت یکسان برای پروژه دیگر نیز استفاده می‌شود و این تداخل در خیلی از موافق مشکل‌زا بوده و باید از یک Browser‌ دیگری (مثلا اگر یکی Google Chrome‌ می‌باشد، دیگری را در Microsoft Edge‌ باز نماییم) استفاده نماییم.

دومین مشکل زمانی اتفاق می‌افتد که می‌خواهیم پروژه را به کارفرما نمایش دهیم و کارفرما به جای مشاهده یک نام دامنه با کلاس و آشنا، با کلمه Localhost مواجه می‌شود! در صورتی که کارفرما دامنه‌هایی به نام‌های Server.com و Client.com ثبت کرده و هاست کرده باشد، فرض کنید که می‌خواهیم شرایط واقعی را به وی نمایش دهیم. در صورتی که بخواهیم به طور واقعی این عمل را انجام دهیم، هزینه و زمان زیادی برای ماه خواهد داشت می‌گیرد! چرا که ابتدا باید به ازای هر Demo، سایت‌ها را بر روی دو دامنه (هاست) Server.com‌ و Client.com آپلود کرده و اتفاقا SSL را نیز بر روی آن‌ها نصب کنیم و سپس اقدام به Demo نماییم و ضمن آن‌که این کار زمان زیادی از ما می‌گیرد، بلکه شاید نخواهیم هنوز سایت‌ها را به صورت عملیاتی و Live‌ بالا بیاوریم!

بنابر این دلایل و دلایل دیگری که شاید شما برنامه‌نویسان عزیز به آن‌ها واقف باشید، ممکن است بخواهیم به صورت Fake، بر روی رایانه شخصی خود (رایانه‌ای که می‌خواهیم به صورت واقعی سامانه را تست کرده و یا Demo بدهیم)، عملیاتی را انجام دهیم که وقتی پروژه اجرا می‌شود به جای نشانی‌های localhost با Port های متفاوت، از دامنه‌های Server.com و Client.com‌ استفاده نماییم.

یک درد و دل کوتاه

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

مراحل حل این مشکلات

ابتدا وارد پوشه ذیل می‌شویم:

C:\Windows\System32\drivers\etc

در داخل این پوشه، فایل hosts (که پسوندی ندارد) را از طریق یک Text Editor که البته به صورت Run as administrator اجرا شده است، باز می‌کنیم.

در داخل این فایل، کلی متن وجود دارد که البته در کنار سمت چپ اکثر آنها حرف # (شارپ) وجود دارد، و این حرف بدان معنی است که متن روبرو، صرفا به عنوان Comment (توضیحات) در نظر گرفته می‌شود.

در داخل این فایل به طور پیش فرض دو عبارت وجود دارد که البته نباید به صورت Comment باشند:

127.0.0.1 localhost
::1       localhost

نکته: در صورتی که دو دستور فوق به صورت Comment‌ شده می‌باشند، علامت # را از ابتدای آن‌ها حذف می‌کنیم. در نهایت باید (با توجه به مثال این مقاله) عبارات ذیل در داخل این فایل قرار بگیرد:

127.0.0.1 localhost
::1       localhost
127.0.0.1 server.com
127.0.0.1 client.com

معمولا پروژه‌هایی که به صورت Client, Server در Visual Studio نوشته می‌شوند، در کنار هم بوده و در داخل یک Solution قرار دارند.

در ادامه راه وارد پوشه پروژه شده (پوشه‌ای که فایل sln در داخل آن قرار دارد) و سپس وارد پوشه مخفی vs. می‌شویم. در داخل این پوشه، به دنبال پوشه config می‌گردیم و در داخل آن، فایل applicationhost.config را با یک Text Editor و ترجیحا به صورت Run as administrator باز می‌کنیم.

در داخل این فایل به دنبال کلمه binding می‌گردیم و تغییرات ذیل را در داخل آن اعمال می‌کنیم. باید دقت داشته باشیم که کدهای Port در مثال ذیل، کاملا تستی بوده و باید با توجه به کدهای Port ای که Visual Studio برای پروژه‌های ما در نظر گرفته است،‌ تغییر یابد:

<site name=&quotServer&quot id=&quot2&quot>
<application path=&quot/&quot applicationPool=&quotServer AppPool&quot>
<virtualDirectory path=&quot/&quot physicalPath=&quot...\Server&quot />
</application>
<bindings>
  <binding protocol=&quothttp&quot bindingInformation=&quot*:15770:localhost&quot />
  <binding protocol=&quothttps&quot bindingInformation=&quot*:44322:localhost&quot />
  <binding protocol=&quothttp&quot bindingInformation=&quot*:15770:127.0.0.1&quot />
  <binding protocol=&quothttps&quot bindingInformation=&quot*:44322:127.0.0.1&quot />
</bindings>
</site>
<site name=&quotClient&quot id=&quot3&quot>
<application path=&quot/&quot applicationPool=&quotClient AppPool&quot>
<virtualDirectory path=&quot/&quot physicalPath=&quot...\Client&quot />
</application>
<bindings>
  <binding protocol=&quothttp&quot bindingInformation=&quot*:15771:localhost&quot />
  <binding protocol=&quothttps&quot bindingInformation=&quot*:44323:localhost&quot />
  <binding protocol=&quothttp&quot bindingInformation=&quot*:15771:127.0.0.1&quot />
  <binding protocol=&quothttps&quot bindingInformation=&quot*:44323:127.0.0.1&quot />
</bindings>
</site>

پس از این تغییرات، به سادگی می‌توانیم به جای نشانی‌هایی که در ابتدا مقاله نوشتیم، از آدرس‌های ذیل برای نمایش، تست و دموی سامانه‌ها استفاده نماییم:

برای نشانی Server:

http://server.com:15770
https://server.com:44322

برای نشانی Client:

http://client.com:15771
https://client.com:44323