Heim >Web-Frontend >js-Tutorial >@ts-stack/multer vereinfacht das Hochladen von Dateien in ein Node.js-basiertes Backend

@ts-stack/multer vereinfacht das Hochladen von Dateien in ein Node.js-basiertes Backend

WBOY
WBOYOriginal
2024-07-29 15:31:24819Durchsuche

@ts-stack/multer simplifies uploading files to a Node.js-based backend

Dieses Paket ist eigentlich ein Fork des bekannten nativen Pakets für ExpressJS Multer v2.0.0-rc.4. Es wird vor allem für Entwickler interessant sein, die die Programmierung im Promise-Stil anstelle von Middleware bevorzugen. Darüber hinaus ist es auch wichtig, dass dieses Paket in TypeScript geschrieben ist, sodass die darin enthaltene Typunterstützung und Kontextdokumentation erstklassig ist.

Installieren

Stellen Sie sicher, dass Node.js >= v20.0.6 installiert ist. Das Paket kann mit folgendem Befehl installiert werden:

npm install @ts-stack/multer

Verwendung

Multer gibt ein Objekt mit vier Eigenschaften zurück: formFields, file, files und groups. Das formFields-Objekt enthält die Werte der Textfelder des Formulars, das Datei-, Datei- oder Gruppenobjekt enthält die über das Formular hochgeladenen Dateien (als lesbarer Stream).

Im folgenden Beispiel wird ExpressJS nur der Einfachheit halber verwendet. Tatsächlich gibt @ts-stack/multer keine Middleware zurück und ist daher für ExpressJS weniger praktisch als das Originalmodul. Grundlegendes Anwendungsbeispiel:

import { Multer } from '@ts-stack/multer';
import express from 'express';
import { createWriteStream } from 'node:fs';

// Here `avatar`, `photos` and `gallery` - is the names of the field in the HTML form.
const multer = new Multer({ limits: { fileSize: '10MB' } });
const parseAvatar = multer.single('avatar');
const parsePhotos = multer.array('photos', 12);
const parseGroups = multer.groups([{ name: 'avatar', maxCount: 1 }, { name: 'gallery', maxCount: 8 }]);
const app = express();

app.post('/profile', async (req, res, next) => {
  const parsedForm = await parseAvatar(req, req.headers);
  // parsedForm.file is the `avatar` file
  // parsedForm.formFields will hold the text fields, if there were any
  const path = `uploaded-files/${parsedForm.file.originalName}`;
  const writableStream = createWriteStream(path);
  parsedForm.file.stream.pipe(writableStream);
  // ...
});

app.post('/photos/upload', async (req, res, next) => {
  const parsedForm = await parsePhotos(req, req.headers);
  // parsedForm.files is array of `photos` files
  // parsedForm.formFields will contain the text fields, if there were any
  const promises: Promise<void>[] = [];
  parsedForm.files.forEach((file) => {
    const promise = new Promise<void>((resolve, reject) => {
      const path = `uploaded-files/${file.originalName}`;
      const writableStream = createWriteStream(path);
      file.stream.pipe(writableStream);
      writableStream.on('finish', resolve);
      writableStream.on('error', reject);
    });
    promises.push(promise);
  });

  await Promise.all(promises);
  // ...
});

app.post('/cool-profile', async (req, res, next) => {
  const parsedForm = await parseGroups(req, req.headers);
  // parsedForm.groups is an object (String -> Array) where fieldname is the key, and the value is array of files
  //
  // e.g.
  //  parsedForm.groups['avatar'][0] -> File
  //  parsedForm.groups['gallery'] -> Array
  //
  // parsedForm.formFields will contain the text fields, if there were any
});

Falls Sie ein mehrteiliges Nur-Text-Formular verarbeiten müssen, können Sie die Methode .none() verwenden, Beispiel:

import { Multer } from '@ts-stack/multer';
import express from 'express';

const parseFormFields = new Multer().none();
const app = express();

app.post('/profile', async (req, res, next) => {
  const parsedForm = await parseFormFields(req, req.headers);
  // parsedForm.formFields contains the text fields
});

Fehlerbehandlung

Dies ist eine Liste von Fehlercodes:

const errorMessages = new Map<ErrorMessageCode, string>([
  ['CLIENT_ABORTED', 'Client aborted'],
  ['LIMIT_FILE_SIZE', 'File too large'],
  ['LIMIT_FILE_COUNT', 'Too many files'],
  ['LIMIT_FIELD_KEY', 'Field name too long'],
  ['LIMIT_FIELD_VALUE', 'Field value too long'],
  ['LIMIT_FIELD_COUNT', 'Too many fields'],
  ['LIMIT_UNEXPECTED_FILE', 'Unexpected file field'],
]);

Sie können diese Fehlercodes in der Eigenschaft MulterError#code sehen:

import { Multer, MulterError, ErrorMessageCode } from '@ts-stack/multer';

// ...
try {
  const multer = new Multer().single('avatar');
  const parsedForm = await multer(req, req.headers);
  // ...
} catch (err) {
  if (err instanceof MulterError) {
    err.code // This property is of type ErrorMessageCode.
    // ...
  }
}

Das obige ist der detaillierte Inhalt von@ts-stack/multer vereinfacht das Hochladen von Dateien in ein Node.js-basiertes Backend. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn