Керування доступом до локальних файлів для серверних дій Next.js 14.1 на Vercel

Виправлення проблем із доступом до файлів у діях сервера Next.js 14.1 за допомогою різних методів

Для безпечного доступу до локальних файлів у виробництві це рішення використовує серверну частину Node.js із маршрутом API.

const { PDFDocument } = require('pdf-lib');
const fs = require('fs');
const path = require('path');
export default async function handler(req, res) {
  try {
    const pdfDataDir = path.join(process.cwd(), 'actions', 'pdf_data');
    const templatePath = path.join(pdfDataDir, 'template.pdf');
    const pdfDoc = await PDFDocument.load(fs.readFileSync(templatePath));
    const pdfBytes = await pdfDoc.save();
    res.setHeader('Content-Type', 'application/pdf');
    res.status(200).send(pdfBytes);
  } catch (error) {
    res.status(500).send('Error generating PDF');
  }
}

Далі скористайтеся конфігурацією Modular Webpack для копіювання файлів. Виробничі збірки для JavaScript

Щоб гарантувати належне об’єднання локальних файлів у виробництво, цей підхід змінює параметри Webpack.

const CopyPlugin = require('copy-webpack-plugin');
const path = require('path');
module.exports = {
  webpack: (config, { dev, isServer }) => {
    if (!dev && isServer) {
      config.plugins.push(
        new CopyPlugin({
          patterns: [{
            from: path.join(__dirname, 'actions', 'pdf_data'),
            to: path.join(__dirname, '.next', 'server', 'actions', 'pdf_data'),
          }],
        })
      );
    }
    return config;
  },
};

Динамічний доступ до файлів за допомогою маршрутів API замість дій сервера

У цьому методі ми використовуємо API-маршрути замість динамічного доступу до файлів, щоб забезпечити готове до виробництва локальне обслуговування файлів.

import { promises as fs } from 'fs';
import path from 'path';
export default async function handler(req, res) {
  try {
    const pdfDataDir = path.join(process.cwd(), 'actions', 'pdf_data');
    const filePath = path.join(pdfDataDir, 'template.pdf');
    const file = await fs.readFile(filePath);
    res.setHeader('Content-Type', 'application/pdf');
    res.status(200).send(file);
  } catch (err) {
    res.status(500).send('Error loading file');
  }
}

Модульний тест для доступу до файлів у маршруті API

Цей модульний тест підтверджує, що PDF-файл належним чином обслуговується маршрутом API.

import handler from '../pages/api/generate-pdf';
import { createMocks } from 'node-mocks-http';
describe('PDF Generation API', () => {
  it('should return a PDF', async () => {
    const { req, res } = createMocks({ method: 'GET' });
    await handler(req, res);
    expect(res._getStatusCode()).toBe(200);
    expect(res._getHeaders()['content-type']).toBe('application/pdf');
  });
});

Поширені запитання щодо обробки локальних файлів у діях сервера Next.js

1. Як я можу переконатися, що локальні файли доступні у виробництві?
2. За включенням CopyPlugin у вашій конфігурації Webpack ви можете переконатися, що локальні ресурси, такі як PDF-файли та шрифти, об’єднано в збірку та стане доступним.
3. Чому я отримую помилки ENOENT у виробництві?
4. Причиною цієї помилки є те, що в таких системах, як Vercel, файли або каталоги, до яких ви намагаєтеся отримати доступ, не були включені до робочої збірки.
5. Я хочу отримати доступ до файлів, але чи можу я використовувати маршрути API замість дій сервера?
6. Так, ви можете мати додатковий контроль і гарантувати, що файли надаються належним чином у робочому середовищі, передаючи функції доступу до файлів на маршрут API.
7. Яка роль process.cwd() у шляхах до файлів?
8. process.cwd() надає поточний робочий каталог, допомагаючи динамічно створювати шляхи до файлів незалежно від варіацій середовища.
9. Чи варто мені використовувати @vercel/blob для зберігання файлів?
10. Хоча @vercel/blob є варіантом, він може призвести до затримки таких процесів, як створення PDF. Швидшими варіантами можуть бути маршрути API або прямий доступ до файлів.

Останні думки щодо обробки доступу до локальних файлів

Доступ до локальних файлів може бути великою проблемою під час використання серверних дій у Next.js 14.1, особливо на Vercel. Однак розробники можуть переконатися, що їхні файли упаковані та доступні для виробництва, використовуючи такі технології, як CopyPlugin і маршрути API Webpack.

Ви можете уникнути будь-яких проблем, зосередившись на техніках динамічної обробки файлів, як-от перенесення функцій файлу на маршрути API. Подальші дослідження методів доступу до файлів можуть призвести до ще більш ефективних рішень для подальшого розгортання.