typescript 45 lines · 7 steps

Handling avatar uploads in NestJS

A NestJS controller that accepts an image upload, stores it safely on disk, and validates it before handing off to a service.

Explained by highlit

NestJS Intermediate file-upload validation interceptors multer dependency-injection

1import {
Controller,
Post,
UploadedFile,
UseInterceptors,
ParseFilePipeBuilder,
HttpStatus,
8} from '@nestjs/common';
9import { FileInterceptor } from '@nestjs/platform-express';
10import { diskStorage } from 'multer';
11import { extname } from 'path';
12import { randomUUID } from 'crypto';
13import { AvatarService } from './avatar.service';
14 
15@Controller('users/:id/avatar')
16export class AvatarController {
constructor(private readonly avatarService: AvatarService) {}
18 
@Post()
@UseInterceptors(
  FileInterceptor('avatar', {
    storage: diskStorage({
      destination: './uploads/avatars',
      filename: (_req, file, cb) => {
        cb(null, `${randomUUID()}${extname(file.originalname)}`);
      },
    }),
    limits: { fileSize: 2 * 1024 * 1024 },
  }),
)
async upload(
  @UploadedFile(
    new ParseFilePipeBuilder()
      .addFileTypeValidator({ fileType: /^image\/(jpeg|png|webp)$/ })
      .addMaxSizeValidator({ maxSize: 2 * 1024 * 1024 })
      .build({
        errorHttpStatusCode: HttpStatus.UNPROCESSABLE_ENTITY,
        fileIsRequired: true,
      }),
  )
  file: Express.Multer.File,
) {
  return this.avatarService.saveAvatar(file);
}
45}

01 / 01

STEP 01

Walkthrough

Space play ←→ step click any line

Three takeaways

1Generating random filenames with the original extension prevents collisions and path-injection from user-supplied names.
2Multer limits guard resources at intake while ParseFilePipe validators enforce type and size at the handler boundary.
3Keeping controllers thin — validate and delegate — leaves persistence logic to an injected service.

Related explainers

typescript

import { registerLocaleData } from '@angular/common';
import localeFr from '@angular/common/locales/fr';
import localeFrExtra from '@angular/common/locales/extra/fr';
import localeDe from '@angular/common/locales/de';

Locale-aware bootstrapping in Angular

i18n localization dependency-injection

Intermediate 8 steps

typescript

import { Module } from '@nestjs/common';
import { ConfigModule } from '@nestjs/config';
import * as Joi from 'joi';

Validating env config at boot in NestJS

configuration schema-validation environment-variables

Intermediate 8 steps

php

<?php
 
namespace App\Services\Checkout;

Validating coupons with Laravel's Pipeline

pipeline chain of responsibility transactions

Intermediate 7 steps

java

@Component
@Converter
public class EncryptedStringConverter implements AttributeConverter<String, String> {

Transparent column encryption in Spring & JPA

encryption aes-gcm jpa-converter

Advanced 10 steps

typescript

import { Inject, Injectable, Logger } from '@nestjs/common';
import { CACHE_MANAGER } from '@nestjs/cache-manager';
import { Cache } from 'cache-manager';
import { InjectRepository } from '@nestjs/typeorm';