رو لپ‌تاپم کار می‌کنه ولی آنلاین نه؛ ۶ دلیل رایج

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

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

چرا اصلاً این اتفاق میفته؟

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

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

اگه هنوز کل این مسیر برات گنگه، اول از localhost تا Production؛ سایتت چطور واقعاً آنلاین میشه رو بخون؛ این مطلب ادامه همونه.

۶ دلیل رایج و راه‌حل هر کدوم

۱. تنظیم‌ها و کلیدها جا موندن

نشونه: صفحه اصلی باز میشه ولی بخش‌هایی که به سرویس بیرونی وصلن خطا میدن، یا کل سایت با خطای ۵۰۰ بالا نمیاد.

علت: این تنظیم‌ها (رمز دیتابیس، کلید سرویس‌ها، آدرس سایت) معمولاً تو فایلی به اسم .env هستن. این فایل عمداً همراه کد فرستاده نمیشه، چون نباید عمومی بشه. یعنی رو سیستم تو هست و اون بالا نیست.

راه‌حل: لیست کامل چیزهایی که پروژه لازم داره رو دربیار و همه‌شون رو تو تنظیمات جای جدید وارد کن. اگه کد رو با AI نوشتی، همون‌جا ازش بپرس «این پروژه برای اجرا به چه متغیرهایی نیاز داره؟». درباره نگه‌داری درست این کلیدها تو کلید API و فایل .env رو کجا نگه دارم جدا نوشتیم.

۲. آدرس localhost تو کد مونده

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

علت: یه جای کد آدرس http://localhost:3000 مستقیم نوشته شده. مرورگر کاربر که اون آدرس رو باز کنه، داره کامپیوتر خودش رو صدا می‌زنه، نه سایت تو رو. این اشتباه تو کدهایی که با AI نوشته میشن خیلی رایجه.

راه‌حل: کل پروژه رو دنبال کلمه localhost و 127.0.0.1 بگرد:

grep -rn "localhost" . --exclude-dir=node_modules

هر جا پیدا شد، به‌جای آدرس ثابت از یه تنظیم بخونش تا رو هر محیطی مقدار خودش رو بگیره.

۳. دیتابیس از اون بالا در دسترس نیست

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

علت: دیتابیس هنوز رو لپ‌تاپ خودته، یا آدرسش همون localhost مونده، یا دیتابیس اجازه اتصال از بیرون رو نمیده. جدول‌ها هم ممکنه اون بالا اصلاً ساخته نشده باشن.

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

۴. دستور اجرا اشتباهه

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

علت: رو لپ‌تاپت npm run dev می‌زنی. اون حالت مخصوص توسعه‌ست: هر تغییر رو زنده می‌بینی، خطاها کامل نشون داده میشن و سرعت اصلاً مهم نیست. نسخه واقعی باید اول ساخته و بعد اجرا بشه.

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

npm run build
npm run start

اگه build رو سیستم خودت خطا داد، مشکل از جای جدید نیست؛ از کده.

۵. اسم فایل‌ها؛ حروف بزرگ و کوچیک

نشونه: عکس‌ها نمیان، یا یه صفحه خاص خطای «پیدا نشد» میده، در حالی که فایلش سر جاشه.

علت: ویندوز و مک معمولاً Logo.png و logo.png رو یکی حساب می‌کنن. جایی که سایتت آنلاین میشه تقریباً همیشه لینوکسه و این دو تا رو دو فایل کاملاً جدا می‌بینه. پس چیزی که رو سیستم تو پیدا میشد، اون بالا اصلاً وجود نداره.

راه‌حل: اسم فایل و اسمی که تو کد صدا زدی رو حرف‌به‌حرف مقایسه کن. عادت خوب اینه که همه اسم‌ها رو با حروف کوچیک و خط تیره بنویسی: main-logo.png. مسیرهای مطلق سیستم خودت مثل C:\Users\... هم باید کلاً از کد دربیان.

۶. پورت و فایروال

نشونه: هیچی باز نمیشه و مرورگر بعد از مدتی میگه نتونست وصل بشه، ولی خود برنامه روی سرور داره اجرا میشه.

علت: برنامه‌ت داره رو یه پورت داخلی گوش میده (مثلاً ۳۰۰۰) ولی چیزی ترافیک بیرون رو به اون پورت وصل نکرده، یا فایروال جلوش رو گرفته. گاهی هم برنامه فقط رو 127.0.0.1 گوش میده، یعنی فقط جواب خود همون کامپیوتر رو میده.

راه‌حل: مطمئن شو برنامه رو 0.0.0.0 گوش میده و پورتش رو از تنظیمات محیط می‌خونه، نه ثابت از تو کد. بعد یه وب‌سرور جلوش بذار که ترافیک آدرس اصلی رو به اون پورت برسونه. این بخش معمولاً همونیه که سخت‌ترش می‌کنه و آدم‌ها اینجا کمک می‌گیرن.

چطور سریع بفهمم کدومشه؟

به‌جای حدس زدن، از بالا به پایین جلو برو:

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

۲. ببین اصلاً بالا اومده یا نه. اگه برنامه هنگام اجرا کرش کرده، احتمالاً دلیل ۱ یا ۳ـه.

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

۴. npm run build رو رو سیستم خودت بزن. اگه اینجا هم شکست، دلیل ۴ـه و به محیط ربطی نداره.

۵. یه بار همه تنظیم‌ها رو با هم مقایسه کن. فایل .env لپ‌تاپت رو کنار تنظیمات جای جدید بذار و خط‌به‌خط تیک بزن.

اگه قبل از آنلاین کردن یه بار قبل از آنلاین کردن کد AI چی رو چک کنم رو مرور کنی، نصف این شش تا اصلاً پیش نمیان.

سوال‌های پرتکرار

چرا کدی که رو لپ‌تاپم کار می‌کنه آنلاین خطا میده؟

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

از کجا بفهمم مشکل از کده یا از جایی که سایت روشه؟

یه بار npm run build و بعد npm run start رو رو سیستم خودت بزن. اگه همون‌جا هم خراب شد، مشکل از کده. اگه سالم اجرا شد، مشکل از تفاوت محیطه.

سایتم بالا میاد ولی صفحه سفیده، یعنی چی؟

یعنی درخواست رسیده ولی وسط کار چیزی شکسته؛ معمولاً یه تنظیم نبوده یا دیتابیس جواب نداده. جواب واقعی تو لاگ سروره، نه تو مرورگر.

پروژه‌م رو با AI ساختم، فرقی می‌کنه؟

مسیر همونه، فقط چون کد رو خودت ننوشتی ممکنه ندونی به چی وابسته‌ست. از همون ابزار AI بخواه لیست متغیرها و سرویس‌های لازم پروژه رو برات دربیاره.

خلاصه

• تقریباً همیشه کد سالمه؛ مشکل از فرق لپ‌تاپ تو با جایی که سایت روشه.
• شش دلیل رایج: تنظیم‌های جامونده، آدرس localhost تو کد، دیتابیس در دسترس نبودن، دستور اجرای اشتباه، حروف بزرگ و کوچیک اسم فایل‌ها، و پورت یا فایروال.
• اول لاگ سرور رو بخون؛ متن خطای واقعی همیشه اونجاست.
• npm run build رو سیستم خودت، سریع‌ترین راه برای جدا کردن مشکل کد از مشکل محیطه.
• قبل از هر جابه‌جایی، خودت یه نسخه از فایل‌ها و تنظیم‌ها جایی جدا نگه دار.

اگه چیزی که می‌بینی یه صفحه خطای عددیه، تو خطای ۵۰۰ یعنی چی دقیقاً همون رو باز کردیم.