محتوای آموزشی وبلاگ نت‌آرام
برنامه Next.js را به هاست Node.js منتقل کرده‌اید. صفحه اصلی باز می‌شود، اما چیدمان به‌هم ریخته و تصاویر یا فایل‌های JavaScript با خطای ۴۰۴ روبه‌رو هستند. اگر برنامه را با خروجی
standalone ساخته‌اید، یکی از علت‌های رایج این است که فایل‌های public یا .next/static همراه فایل شروع برنامه به محل درست منتقل نشده‌اند.ابتدا مشخص می‌کنیم از چه نوع خروجی استفاده می‌کنید و کدام فایل واقعاً خطا دارد. سپس یک بسته آزمایشی می‌سازیم، فایل‌های لازم را به آن اضافه می‌کنیم و پاسخ واقعی را می‌سنجیم. امکانات Next.js و روش پذیرش فایل شروع در پنل‌ها و نسخه‌های مختلف متفاوت‌اند؛ قبل از استقرار نهایی، نسخه Node.js و امکان اجرای خروجی پروژه را با سرویس خود تطبیق دهید.
۱. نوع خروجی را با نیاز پروژه اشتباه نگیرید
در پروژه‌ای که قابلیت‌های وابسته به سرور، مانند پردازش درخواست در زمان اجرا، دارد، صرف آپلود HTML به یک هاست فایل کافی نیست. خروجی
standalone یک بسته مناسب اجرای سرور Node.js است. در مقابل، output: 'export' برای پروژه‌ای است که می‌تواند به خروجی ایستا تبدیل شود و فایل‌های ساخته‌شده‌اش با وب‌سرور معمولی سرو شوند. هر قابلیت Next.js در حالت ایستا پشتیبانی نمی‌شود.تغییر از یک روش به روش دیگر فقط با عوض‌کردن نام پوشه انجام نمی‌شود. اگر مطمئن نیستید، ابتدا نیاز مسیرهای پویا، ورود، API و بازتولید محتوا را با مستندات نسخه پروژه بسنجید. این آموزش روی بسته standalone تمرکز دارد و برای پروژه زنده، ساخت آزمایشی و امکان بازگشت لازم است.
۲. فایل ناموفق را در مرورگر پیدا کنید
صفحه مشکل‌دار را باز کنید،
F12 را بزنید و در بخش Network صفحه را دوباره بارگذاری کنید. روی یک فایل CSS یا JavaScript ناموفق کلیک کنید و نشانی کامل، کد پاسخ و نوع محتوا را یادداشت کنید. نشانی‌های فایل ساخته‌شده اغلب با /_next/static/ شروع می‌شوند؛ فایل‌هایی که خودتان در public گذاشته‌اید می‌توانند نشانی متفاوتی داشته باشند.کد ۴۰۴ نشان می‌دهد در آن مسیر پاسخی برای فایل پیدا نشده است. اگر پاسخ ۲۰۰ ولی محتوایش HTML یا صفحه ورود است، مرورگر فایل مورد انتظار را نگرفته. نشانی مثال را با مسیر واقعی جایگزین و از ترمینال بررسی کنید:
کد / دستورcurl -I https://example.com/_next/static/css/example.css
فایل و دامنه مثال ساختگی‌اند. پاسخ
کد / دستورContent-Type و هر انتقال Location را ببینید. چون بعضی سرورها به HEAD متفاوت پاسخ می‌دهند، یک فایل کوچک را با GET نیز می‌توانید بیازمایید:curl -sS -L -D - -o /dev/null https://example.com/_next/static/css/example.css
این آزمایش با فایل واقعی پروژه شما معنا دارد. اگر مشکل فقط یک تصویر در
public است، نشانی همان تصویر را آزمایش کنید. خطای گواهی یا قطع شبکه مسیر دیگری برای رفع دارد.۳. بسته را در محیط آزمایشی بسازید
در نسخه‌ای جدا از برنامه زنده، به پوشه‌ای بروید که
کد / دستورpackage.json و تنظیمات Next.js در آن هستند. در صورت استفاده از هاست، فرمان ورود به محیط Node.js اختصاصی برنامه را از پنل بگیرید. این دستورها مسیر و نسخه‌ها را نشان می‌دهند:pwd
node --version
npm --version
npm ls next
نسخه Node.js باید با نسخه Next.js و وابستگی‌های پروژه سازگار باشد. اگر
npm ls next خطا داد، ابتدا نصب و فایل قفل این پروژه را بررسی کنید. برای اختلاف فایل قفل، راهنمای رفع خطای npm ci را بخوانید. از اجرای نصب یا ساخت روی تنها نسخه سالم سایت بدون نسخه بازگشت خودداری کنید.در فایل تنظیمات همان پروژه، حالت خروجی standalone طبق قالب نسخه آن تنظیم می‌شود. نمونه زیر برای پیکربندی CommonJS است:
کد / دستورmodule.exports = {
output: "standalone",
};
اگر فایل پروژه شما ESM یا TypeScript است، شکل export فرق دارد. تنظیمات موجود را پاک نکنید؛ فقط گزینه مناسب را در پیکربندی فعلی قرار دهید. سپس با اسکریپت ساختی که واقعاً در
کد / دستورpackage.json تعریف شده، پروژه آزمایشی را بسازید. در بسیاری از پروژه‌ها این دستور است:npm run build
اگر اسکریپت
کد / دستورbuild تعریف نشده یا ساخت خطا می‌دهد، ابتدا همان خطا را برطرف کنید. پس از ساخت موفق، وجود فایل شروع و پوشه فایل‌های ثابت را ببینید:ls -la .next/standalone
ls -la .next/static
در بسیاری از پروژه‌های تک‌پوشه‌ای، فایل شروع در
.next/standalone/server.js ساخته می‌شود. در ساختار monorepo، مسیر خروجی ممکن است زیرپوشه داشته باشد؛ مسیر واقعی را بعد از ساخت پیدا کنید و نسبت به همان فایل شروع ادامه دهید.۴. پوشه‌های لازم را به بسته اضافه کنید
طبق مستندات Next.js، پوشه‌های
کد / دستورpublic و .next/static به‌صورت پیش‌فرض لزوماً داخل standalone کپی نمی‌شوند. اگر قرار است خود سرور standalone آن‌ها را تحویل دهد، در یک خروجی آزمایشی تازه و پس از بررسی مسیرها می‌توانید از نمونه دستورهای لینوکس زیر استفاده کنید:mkdir -p .next/standalone/.next
cp -r .next/static .next/standalone/.next/
cp -r public .next/standalone/
فرمان سوم فقط وقتی لازم است که پروژه پوشه
public دارد. پیش از کپی روی مقصد موجود، محتوای آن و امکان بازگشت را بررسی کنید؛ این دستورها برای یک بسته آزمایشی ساخته‌شده از همین نسخه هستند، نه برای بازنویسی کورکورانه فایل‌های سایت زنده. در monorepo باید مقصد را متناسب با محل واقعی server.js و ساختار خروجی بررسی کنید.اکنون وجود فایل‌های کپی‌شده را ببینید:
کد / دستورls -la .next/standalone/.next/static
ls -la .next/standalone/public
اگر پروژه
public ندارد، نبود پوشه دوم طبیعی است. شماره یا هش فایل‌های ساخته‌شده بین دو build تغییر می‌کند؛ HTML یک build را با پوشه static مربوط به build دیگری مخلوط نکنید. چنین اختلاطی می‌تواند حتی با وجود پوشه static باعث ۴۰۴ شود.۵. روش اجرای پشتیبانی‌شده سرویس را تأیید کنید
برای آزمایش محلی در محیط کنترل‌شده، مستندات Next.js اجرای فایل شروع مستقل را نشان می‌دهند:
کد / دستورnode .next/standalone/server.js
این فرمان سرور ایجاد می‌کند. آن را روی اینترنت عمومی یا روی پورتی که سرویس دیگری استفاده می‌کند بدون تنظیم دسترسی اجرا نکنید. در هاست اشتراکی، برنامه ممکن است باید از پنل و سازوکار Passenger یا مدیر برنامه سرویس اجرا شود؛ پذیرش فایل شروع، مسیر پروژه، پورت یا سوکت و منابع ساخت و اجرا را با تنظیمات همان سرویس تأیید کنید. بازکردن پورت دلخواه یا نصب سرویس سیستمی از حساب اشتراکی را فرض نکنید.
فایل‌های آزمایش‌شده را به روش انتشار برنامه خود و با امکان بازگشت منتقل کنید. پس از Restart همان برنامه در پنل، صفحه و فایل ناموفق مرحله اول را دوباره بررسی کنید. اگر فایل‌های HTML جدیدند ولی آدرس‌های قدیمی در مرورگر دیده می‌شوند، کش مرتبط و هماهنگی کامل بسته را بررسی کنید. پاک‌کردن همه کش یا مخلوط‌کردن پوشه‌های دو نسخه بدون تشخیص می‌تواند مشکل را بیشتر کند.
اگر هنوز ۴۰۴ یا خطای اجرا می‌بینید
وجود همان فایل دارای هش در بسته فعال، مسیر واقعی فایل شروع و پاسخ وب‌سرور را کنار هم قرار دهید. اگر فایل روی دیسک هست ولی URL پاسخ HTML می‌دهد، تنظیم دامنه، پراکسی یا مسیر برنامه ممکن است درخواست را به جای دیگری بفرستد. اگر برنامه هنگام اجرا پکیج یا فایل بومی پیدا نمی‌کند، ساخت روی سیستم‌عامل و معماری متفاوت، فایل‌های خارج از محدوده tracing یا نصب ناقص را بررسی کنید. فایل‌های محرمانه را برای رفع مشکل در
public کپی نکنید.در پایان، صفحه اصلی، یک مسیر داخلی، یک تصویر و فایل CSS یا JavaScript را هم از مرورگر و هم در صورت نیاز با درخواست مستقیم آزمایش کنید. امکانات سرویس را در صفحه هاست Node.js نت‌آرام و جزئیات نسخه پروژه را در مستند رسمی خروجی standalone و راهنمای خروجی ایستا ببینید.
اشتراک‌گذاری:
لینکدینتلگرامایکس
مقاله قبلی
مقاله قبلی وجود ندارد.
مقاله بعدی
دیدگاه‌ها (۰)
دیدگاه‌های تاییدشده و پاسخ‌های تیم نت‌آرام