Поддержка multipart/form-data была недавно добавлена в LoopBack 4 через https://github.com/strongloop/loopback-next/pull/1936.
Поскольку существует много разных способов обработки загруженных файлов, LoopBack 4 не предоставляет стандартного решения для загрузки файлов из коробки. Вместо этого он позволяет приложениям реализовывать собственный обработчик выгрузки файлов.
В приведенных ниже примерах я настраиваю multer на использование памяти. Это, вероятно, не то, что вы хотите делать в производственной среде, пожалуйста, обратитесь к документации multer , чтобы узнать, как настроить другой сервер хранения.
Также обратите внимание, что вы также можете использовать multer в TypeScript, просто установите и добавьте @types/multer в devDependencies.
1. Обрабатывать загрузку файлов в вашем контроллере методом
Вы можете указать LoopBack пропустить синтаксический анализ тела и передать полный запрос методу контроллера. В методе контроллера вызовите multer для обработки загрузки файла. Полный рабочий пример можно найти в file-upload.acceptance.ts , я кросс-публикация реализации контроллера здесь.
class FileUploadController {
@post('/show-body', {
responses: {
200: {
content: {
'application/json': {
schema: {
type: 'object',
},
},
},
description: '',
},
},
})
async showBody(
@requestBody({
description: 'multipart/form-data value.',
required: true,
content: {
'multipart/form-data': {
// Skip body parsing
'x-parser': 'stream',
schema: {type: 'object'},
},
},
})
request: Request,
@inject(RestBindings.Http.RESPONSE) response: Response,
): Promise<Object> {
const storage = multer.memoryStorage();
const upload = multer({storage});
return new Promise<object>((resolve, reject) => {
upload.any()(request, response, err => {
if (err) return reject(err);
resolve({
files: request.files,
fields: (request as any).fields,
});
});
});
}
}
2. Зарегистрировать пользовательский LB4 BodyParser
В качестве альтернативы, вы можете перенести синтаксический анализ запросов на загрузку файлов в специализированный синтаксический анализатор и, таким образом, упростить методы контроллера для получения проанализированного результата. Это особенно полезно, когда у вас есть более одного метода контроллера, принимающего загрузку файлов.
Полный рабочий пример можно найти в file-upload-with-parser.acceptance.ts , я публикую здесь соответствующие фрагменты.
Парсер:
class MultipartFormDataBodyParser implements BodyParser {
name = FORM_DATA;
supports(mediaType: string) {
// The mediaType can be
// `multipart/form-data; boundary=--------------------------979177593423179356726653`
return mediaType.startsWith(FORM_DATA);
}
async parse(request: Request): Promise<RequestBody> {
const storage = multer.memoryStorage();
const upload = multer({storage});
return new Promise<RequestBody>((resolve, reject) => {
upload.any()(request, {} as any, err => {
if (err) return reject(err);
resolve({
value: {
files: request.files,
fields: (request as any).fields,
},
});
});
});
}
}
Регистрация парсера в конструкторе вашего приложения:
app.bodyParser(MultipartFormDataBodyParser);
И, наконец, контроллер:
class FileUploadController {
@post('/show-body', {
responses: {
200: {
content: {
'application/json': {
schema: {
type: 'object',
},
},
},
description: '',
},
},
})
async showBody(
@requestBody({
description: 'multipart/form-data value.',
required: true,
content: {
[FORM_DATA]: {
schema: {type: 'object'},
},
},
})
body: unknown,
) {
return body;
}
}