Pipe란?

@Injectable() 데코레이터로 주석이 달린 클래스이다. Data TransformationData Validation 위해서 사용한다. 컨트롤러 경로 처리기에 의해 처리되는 인수에 대해 작동한다.

 

request가 올 때, 바로 handler로 가지 않고 pipe를 거쳐간다. handler에 도달하기 전, Data Transformation과 Data Validation을 하기 위해서이다. 만약, 통과되지 않는다면 handler로 가지않고 Error를 발생시킨다.

 

Data Transformation?

입력 데이터를 원하는 형식으로 변환 (Ex, String to int)

만약, 숫자를 받길 원하는데 문자열 형식으로 온다면 파이프에서 자동으로 숫자로 변환한다.

 

Data Validation?

입력 데이터를 평가하고 유효한 경우 변경되지 않은 상태로 전달하면 된다. 그렇지 않으면 데이터가 올바르지 않을 때 예외를 발생시킨다. 예를들어, 입력 길이가 10 이하여야 하는데, 10자 이상이면 예외를 발생시킨다.

 

Pipe를 사용하는 법 (Binding Pipes)

사용방법은 3가지로 Handler-level Pipes, Parameter-level Pipes, Global-level Pipes가 있다. 

 

Handler-level Pipes

  @Post()
  @UsePipes(pipe)
  createBoard(@Body() CreateBoardDto: CreateBoardDto): Board {
    return this.boardsService.createBoard(CreateBoardDto);
  }

핸들러 레벨에서 @UsePipes() 데코레이터를 이용해서 사용할 수 있다. 이 파이프는 모든 파라미터에 적용이 된다. (CreateBoardDto 내의 속성)

 

Parameter-level Pipes

  @Post()
  createBoard(@Body(ParameterPipe) CreateBoardDto: CreateBoardDto): Board {
    return this.boardsService.createBoard(CreateBoardDto);
  }

파라미터 레벨의 파이프라는 이름처럼 특정한 파라미터에만 적용이되는 파이프이다. 위처럼 CreateBoardDto에만 적용이 된다.

 

Global Pipes

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  app.useGlobalPipes(GlobalPipes);
  await app.listen(3000);
}
bootstrap();

이름처럼 애플리케이션 레벨의 파이프이다. 클라이언트에서 들어오는 모든 요청에 적용이 된다. 가장 상단 파일인 main.ts에 넣어주면 작동한다.

 

Build-in Pipes

Nest.js에 기본적으로 사용할 수 있게 만들어 놓은 6가지의 파이프가 있다.

  • ValidationPipe
  • ParseIntPipe
  • ParseBoolPipe
  • parseArrayPipe
  • parseUUIDPipe
  • DefaultValuePipe

네이밍만으로도 어떤 역할을 하는지 알 수 있게끔 되어있다. 예시로 ParseIntPipe를 사용해보자.

 

  @Get("/:id")
  getBoardById(@Param("id", ParseIntPipe) id: number): Board {
    return this.boardsService.getBoardById(id.toString());
  }

위와같이 작성된 parameter-level pipe 안에 Nest.js에서 제공하는 ParseIntPipe를 사용하여 number를 받도록 코드를 작성했다.

request

int 값을 보내야하지만, absd라는 문자열을 보낸 결과 아래와 같은 에러 메시지가 온다.

{ "message": "Validation failed (numeric string is expected)", "error": "Bad Request", "statusCode": 400}

에러 메시지로 어떠한 request 오류가 있는지 한 번에 알 수 있도록 해준다. (편리하네)

 

 

파이프를 이용한 유효성 체크

  @Post()
  createBoard(@Body() CreateBoardDto: CreateBoardDto): Board {
    return this.boardsService.createBoard(CreateBoardDto);
  }

현재 게시판 서비스를 만들고 있는데, 게시판의 제목과 내용에 ""인 공백을 입력해도 post가 되는 문제가 있다. 파이프를 이용해서 게시물을 생성할 때 유효성을 체크하도록 구현해보려고 한다.

 

필요한 모듈

  • class-validator
  • class-transformer

위 두개의 모듈이 필요하다. 해당 모듈은 명령어를 통해 가져올 수 있다. 아래 명령어를 터미널에서 실행해주자.

npm install class-validator class-transformer --save

document 페이지는 링크에 있다. 문서를 읽어보면 @IsNotEmpty()라는 데코레이터를 사용하면 원하는 기능이 구현될 것 같다. 

 

import { IsNotEmpty } from "class-validator";

export class CreateBoardDto {
  @IsNotEmpty()
  title: string;

  @IsNotEmpty()
  description: string;
}

파라미터에 받아오는 Dto에 위와같이 @IsNotEmpty()를 추가해주었다.

 

  @Post()
  @UsePipes(ValidationPipe)
  createBoard(@Body() CreateBoardDto: CreateBoardDto): Board {
    return this.boardsService.createBoard(CreateBoardDto);
  }

controller에도 @UsePipes 데코레이터를 추가하여 Handler-level pipe를 추가해주었다. ValidationPipe는 built-in pipe로 유효성을 체크하겠다는 의미이다.

 

그렇다면, 테스트를 해보자.

입력없이 request

{ "message": [ "title should not be empty", "description should not be empty" ], "error": "Bad Request", "statusCode": 400}

성공적으로 핸들러에서 에러를 처리하는 모습을 볼 수 있다.

 

 

커스텀 파이프를 이용한 유효성 체크

구현 방법

PipeTransform interface를 새롭게 만들 커스텀 파이프에 구현해줘야 한다. PipeTransform interface는 모든 파이프에서 구현해줘야 하는 인터페이스이다. 해당 Interface는 transform() 메소드를 필요로 하는데, nest.js가 인자를 처리하기 위해서 사용된다.

 

transform 메소드

  • value
  • metadata

위 두개의 인자를 가진다. 해당 메소드에서 return된 값은 route 핸들러로 전해지고, 예외가 발생한다면 클라이언트에 바로 전달된다.

 

실제 사용

import { ArgumentMetadata, PipeTransform } from "@nestjs/common";

export class BoardStatusValidationPipe implements PipeTransform {
  transform(value: any, metadata: ArgumentMetadata) {
    console.log("value", value);
    console.log("metadata", metadata);
     
    return value;
  }
}

위와 같이 PipeTransform class를 만들고

  @Patch("/:id/status")
  updateBoardStatus(
    @Param("id") id: string,
    @Body("status", BoardStatusValidationPipe) status: BoardStatus
  ) {
    return this.boardsService.updateBoardStatus(id, status);
  }

위와 같이 사용하고 싶은 곳에 넣어주면 된다. 

직접 돌려보면, Pipe 코드를 읽어 log가 출력되는 것을 확인할 수 있다. 그렇다면, 현재 enum에 없는 값으로 update해도 작동하고 있는데 pipe를 통해 막아보자.

 

export class BoardStatusValidationPipe implements PipeTransform {
  readonly StatusOptions = [BoardStatus.PRIVATE, BoardStatus.PUBLIC];

  transform(value: any, metadata: ArgumentMetadata) {
    value = value.toUpperCase();

    if (!this.isStatusValid(value))
      throw new BadRequestException(`${value} isn't in the status`);

    return value;
  }

  private isStatusValid(status: any): boolean {
    const index = this.StatusOptions.indexOf(status);
    return index !== -1;
  }
}

코드를 위와같이 변경해주고 테스트해보자.

성공 실패

정상적으로 예외처리하는 것을 확인할 수 있다.

 

 

Reference

'Javascript' 카테고리의 다른 글

[Nest.js] Module  (0) 2024.06.11
ES6  (0) 2024.06.05
기본 Javascript 문법  (0) 2024.06.04
왜 Javascript & Node.js를 사용할까?  (0) 2024.05.31

Nest.js Module

모듈은 @Module() 데코레이터로 주석이 달린 클래스이다. @Module() 데코레이터는 Nest.js가 애플리케이션 구조를 구성하는 데 사용하는 메타 데이터를 제공한다. 여기서 데코레이터는 @Moudle() 속성이 모듈을 설명하는 단일 개체를 사용한다.

App Module 안에 BoardModule과 Auth Module이 있으면 각 모듈 안에 Controller, Entity, Service 등이 있다. (이렇게 모듈별로 나눠서 MSA를 구축하는건가???)  -> 맞는 것 같다. 효과적으로 모듈을 구성하는 것이 중요해 보인다. 대부분의 애플리케이션에서 결과 아키텍처는 밀접하게 관련된 기능 세트를 각각 캡슐화하는 여러 모듈을 사용한다고 한다.

 

각 응용 프로그램은 하나 이상의 모듈(루트 모듈)이 있다. 루트 모듈은 Nest가 사용하는 시작점이다. 

모듈의 모습

 

  • providers
    • nest 인젝터에 의해 인스턴스화되고 적어도 해당 모듈 전체에서 공유될 수 있는 공급자
  • controllers
    • 인스턴스화되어야 하는 이 모듈에 정의된 컨트롤러 세트
  • imports
    • 해당 모듈에 필요한 공급자를 내보내는 가져온 모듈 목록
  • exports
    • 하위 집합은 providers 모듈에서 제공되며, 모듈을 가져오는 다른 모듈에서 사용할 수 있어야 한다. 공급자 자체 또는 해당 토큰만 사용할 수 있다.

모듈은 기본적으로 공급자를 캡슐화한다. 즉, 현재 모듈에 직접 포함되지 않거나 가져온 모듈에서 내보낸 공급자를 삽입할 수 없다. 따라서 모듈에서 내보낸 공급자를 모듈의 공용 인터페이스 또는 API로 간주할 수 있다.

 

Feature Module

CatsController, CatsService는 동일한 애플리케이션 도메인에 속한다. 서로 밀접하게 관련되어 있으므로 기능 모듈로 이동하는 것이 좋다. 기능 모듈은 단순히 특정 기능과 관련된 코드를 구성하여 코드를 체계적으로 유지하고 명확한 경계를 설정한다. 이는 특히 애플리케이션의 규모가 커짐에 따라 복잡성을 관리하고 SOLID 원칙으로 개발하는데 도움이 된다.

Cat/cats.module.ts

import { Module } from '@nestjs/common';
import { CatsController } from './cats.controller';
import { CatsService } from './cats.service';

@Module({
  controllers: [CatsController],
  providers: [CatsService],
})
export class CatsModule {}
!힌트
CLI를 사용하여 모듈을 생성하려면 $ nest g moudle cats 명령을 실행하기만 하면 된다.

위 에서는 CatsMoudle 파일에 cats.module.ts를 정의하고 이 모듈과 관련된 모든 것을 cats 디렉터리로 옮겼다. 마지막으로 해야 할 일은 이 모듈을 루트 모듈로 가져오는 것이다. 

app.module.ts

import { Module } from '@nestjs/common';
import { CatsModule } from './cats/cats.module';

@Module({
  imports: [CatsModule],
})
export class AppModule {}

현재 디렉터리 구조는 아래와 같다.

 

공유 모듈

nest에서 모듈은 기본적으로 싱글톤이므로 여러 모듈 간에 모든 공급자의 동일한 인스턴스를 쉽게 공유할 수 있다. 모든 모듈은 자동으로 공유 모듈이 되기 때문에 일단 생성되면 모든 모듈에서 재사용할 수 있다. 여러 다른 모듈 간에 CatsService 인스턴스를 공유해야된다고 가정해본다면, 아래와 같이 CatsService exports 공급자를 모듈의 배열에 추가하여 공급자를 내보내야 한다.

cats.module.ts

import { Module } from '@nestjs/common';
import { CatsController } from './cats.controller';
import { CatsService } from './cats.service';

@Module({
  controllers: [CatsController],
  providers: [CatsService],
  exports: [CatsService]
})
export class CatsModule {}

이제 catsmodule를 가져오는 모든 모듈은 Cats Service에 액세스할 수 있으며 이를 가져오는 다른 모든 모듈과 동일한 인스턴스를 공유한다. 

 

Module re-exporting

위에서 볼 수 있듯 모듈은 내부 공급자를 내보낼 수 있다. 추가적으로, 가져온 모듈을 다시 내보낼 수도 있다. 아래 예에서는 CommonMoudle을 coremodule로 가져오거나 내보내므로 이 항목을 가져오는 다른 모듈에서 사용할 수 있다.

@Module({
  imports: [CommonModule],
  exports: [CommonModule],
})
export class CoreModule {}

 

 

Dependency Injection

모듈 클래스는 공급자도 주입할 수 있다.

import { Module } from '@nestjs/common';
import { CatsController } from './cats.controller';
import { CatsService } from './cats.service';

@Module({
  controllers: [CatsController],
  providers: [CatsService],
})
export class CatsModule {
  constructor(private catsService: CatsService) {}
}

 

그러나 모듈 클래스 자체는 순환 종속성으로 인해 공급자로 주입될 수 없다. 

 

 

전역 모듈

동일한 모듈 세트를 모든 곳에서 가져와야 한다면 불편할 수 있다. Nest와 달리 Angular는 providers 전역 범위에 등록된다. 일단 정의되면 어디에서나 사용할 수 있다. 그러나 Nest는 모듈 범위 내에 공급자를 캡슐화한다. 캡슐화 모듈을 먼저 가져오지 않으면 다른 곳에서 모듈 공급자를 사용할 수 없다.

 

즉시 사용 가능한 모든 곳에서 사용할 수 있는 공급자 세트를 제공하려는 경우 데코레이터를 사용하여 모듈을 전역으로 @Global()하면 된다.

import { Module, Global } from '@nestjs/common';
import { CatsController } from './cats.controller';
import { CatsService } from './cats.service';

@Global()
@Module({
  controllers: [CatsController],
  providers: [CatsService],
  exports: [CatsService],
})
export class CatsModule {}

 

데코레이터 @Global()은 모듈을 전역 범위로 만든다. 전역 모듈은 일반적으로 루트 또는 코어 모듈에 의해 한 번만 등록되어야 한다.

 

 

동적 모듈

Nest 모듈 시스템은 동적 모듈이라는 강력한 기능이 포함되어 있다. 이 기능을 사용하면 공급자를 동적으로 등록하고 구성할 수 있는 사용자 정의 가능한 모듈을 쉽게 만들 수 있다. 동적 모듈은 링크에서 광범위하게 다룬다. 

 

아래는 DatabaseModule에 대한 동적 모듈 정의의 예이다.

import { Module } from '@nestjs/common';
import { createDatabaseProviders } from './database.providers';
import { Connection } from './connection.provider';

@Module({
  providers: [Connection],
  exports: [Connection],
})
export class DatabaseModule {
  static forRoot(entities = [], options) {
    const providers = createDatabaseProviders(options, entities);
    return {
      module: DatabaseModule,
      providers: providers,
      exports: providers,
    };
  }
}
!힌트
forRoot() 메서드는 동기적, 비동기적으로 동적 모듈을 반환할 수 있다.

이 모듈은 기본적으로 Connection 공급자를 정의하지만 추가적으로 forRoot() 메서드에 전달된 entities 및 개체에 따라 저장소와 같은 공급자 컬렉션을 노출한다. 동적 모듈에서 반환된 속성은 데코레이터에 정의된 기본 모듈 메타데이터를 확장한다. 이것이 정적으로 선언된 공급자와 동적으로 생성된 저장소 공급자가 모두 모듈에서 내보내지는 방식이다.

 

전역 범위에 동적 모듈을 등록하려면 global 속성을 true로 설정하면 된다.

{
  global: true,
  module: DatabaseModule,
  providers: providers,
  exports: providers,
}

 

DatabaseModule을 아래와 같은 방식으로 가져오고 구성할 수 있다.

import { Module } from '@nestjs/common';
import { DatabaseModule } from './database/database.module';
import { User } from './users/entities/user.entity';

@Module({
  imports: [DatabaseModule.forRoot([User])],
})
export class AppModule {}

동적 모듈을 다시 내보내려면 forRoot() 내보내기 배열에서 메서드 호출을 생략할 수 있다.

import { Module } from '@nestjs/common';
import { DatabaseModule } from './database/database.module';
import { User } from './users/entities/user.entity';

@Module({
  imports: [DatabaseModule.forRoot([User])],
  exports: [DatabaseModule],
})
export class AppModule {}
!힌트
링크에서는 configurableModuleBuilder를 사용하여 고도로 사용자 정의 가능한 동적 모듈을 구축하는 방법을 알 수 있다.

 

 

Reference

'Javascript' 카테고리의 다른 글

Nest.js Pipes  (0) 2024.06.17
ES6  (0) 2024.06.05
기본 Javascript 문법  (0) 2024.06.04
왜 Javascript & Node.js를 사용할까?  (0) 2024.05.31

ES6

ECMAScript(ES6)는 JavaScript의 표준화된 버전이다. 모든 주요 브라우저는 이 사양을 따르기 때문에 ES6와 JavsScript라는 용어는 서로 바꿔 사용할 수 있다. 이전까지 배운 Javascript의 대부분은 2009년에 완성된 ES5에 있었다. 2015년에 출시된 ES6에는 언어에 강력한 새 기능이 많이 추가 되었다.
ES6를 통해 화살표 함수, 구조 분해, 클래스, 약속 및 모듈을 포함한 새로운 기술을 배울 수 있다.

 

Object.freeze()

let obj = {
  name:"FreeCodeCamp",
  review:"Awesome"
};
Object.freeze(obj);

변경하면 안되는 변수가 존재할 수 있다. Object.freeze는 변경하면 안되는 변수를 넣어 변경을 못하게 막는다.

 

Inline function

const myFunc = function() {
  const myVar = "value";
  return myVar;
}

우리는 가끔 위와 같은 구성의 함수를 사용하고자 할 때가 있다. ES6은 이러한 방식으로 익명 함수를 작성할 필요가 없도록 화살표 함수 구문을 허용한다.

const myFunc = () => {
  const myVar = "value";
  return myVar;
}

만약, 반환값만 존재하는 경우 아래와 같이도 만들 수 있다.

const myFunc = () => "value";

아래처럼 파라미터를 넣어 return 값을 얻을 수도 있다.

const multiplier = (item, multi) => item * multi;
multiplier(4, 2);

아래와 같이 default 값을 지정해 줄 수 있다. 

const greeting = (name = "Anonymous") => "Hello " + name;

console.log(greeting("John"));		// Hello John
console.log(greeting());		// Hello Anonymous

 

 

Spread Operator

function howMany(...args) {
  return "You have passed " + args.length + " arguments.";
}
console.log(howMany(0, 1, 2));
console.log(howMany("string", null, [1, 2, 3], { }));

보다 유연하게 사용할 수 있도록 나머지 매개변수 기능을 제공한다.

var arr = [6, 89, 3, 45];
var maximus = Math.max.apply(null, arr);

위 ES5 코드는 배열의 최대값을 구하는데 사용된다.

const arr = [6, 89, 3, 45];
const maximus = Math.max(...arr);

ES6에서 스프레드 연산자를 통해 위와같이 보다 편리하게 구할 수 있다.

const arr1 = ['JAN', 'FEB', 'MAR', 'APR', 'MAY'];
arr2 = [...arr1];  // COPY

또한, 위와같이 편리하게 복사도 가능하다.

 

 

Destructuring Assignment

const user = { name: 'John Doe', age: 34 };

const name = user.name;
const age = user.age;

위는 ES5에서 할당하는 예시이다.

const { name, age } = user;

아래는 ES6에서 할당하는 예시이다. 

const { name: userName, age: userAge } = user;

다른 변수명을 사용하고 싶다면, 위와같이 사용할 수 있다.

const user = {
  johnDoe: { 
    age: 34,
    email: 'johnDoe@freeCodeCamp.com'
  }
};

const { johnDoe: { age, email }} = user;
const { johnDoe: { age: userAge, email: userEmail }} = user;

위 와 같이도 사용 가능하다.

const [a, b,,, c] = [1, 2, 3, 4, 5, 6];
console.log(a, b, c); // 1, 2, 5

배열에서 쉼표를 사용하여 구조 분해를 통해 배열의 모든 인덱스 값에 액세스 할 수 있다.

let a = 8, b = 6;
[a, b] = [b, a];

위와 같은 swap 방식도 사용 가능하다.

const [a, b, ...arr] = [1, 2, 3, 4, 5, 7];
console.log(a, b);			// [1,2]
console.log(arr);			// [3,4,5,7]

위와 같이 앞 2개를 제거할 수도 있다.

const stats = {
  max: 56.78,
  standard_deviation: 4.34,
  median: 34.54,
  mode: 23.87,
  min: -0.75,
  average: 35.85
};
const half = (stats) => (stats.max + stats.min) / 2.0; 
const half = ({ max, min }) => (max + min) / 2.0;

위와 같이도 사용할 수 있다고 한다. 이건 좀.. 불편해 보이기도 하다. 구조체의 변수명을 다시 확인해줘야 하는 것 아닌가?

 

 

Template Literals

복잡한 문자열을 더 쉽게 생성할 수 있게 해주는 특수한 유형의 문자열이다.

const person = {
  name: "Zodiac Hasbro",
  age: 56
};

const greeting = `Hello, my name is ${person.name}!
I am ${person.age} years old.`;

위와 같이 사용할 수 있다.

 

Object Literals

const getMousePosition = (x, y) => ({
  x: x,
  y: y
});

위의 코드를 아래와 같이 줄여서 사용할 수 있다.

const getMousePosition = (x, y) => ({ x, y });

 

단, 같은 속성 변수명을 가지고 있어야한다.

 

 

Consise Declarative Functions

const person = {
  name: "Taylor",
  sayHello: function() {
    return `Hello! My name is ${this.name}.`;
  }
};

ES5에서 함수를 선언하려면 위와같은 방식으로 선언해야 했다.

const person = {
  name: "Taylor",
  sayHello() {
    return `Hello! My name is ${this.name}.`;
  }
};

ES6에서는 위와같이 보다 간결하게 함수를 작성할 수 있다.

 

 

Use class Syntax to Define a Constructor Function

 
// Explicit constructor
class SpaceShuttle {
  constructor(targetPlanet) {
    this.targetPlanet = targetPlanet;
  }
}

// Implicit constructor 
class Rocket {
}

위와같이 생성자에 변수를 넣어서 초기화해줄 수 있다. 만약, 명시적으로 생성자를 만들어주지 않는다면, 암시적으로 스스로 선언해준다.

 

 

Use getters and setters to Control Access to an Object

class Book {
  constructor(author) {
    this._author = author;
  }
  // getter
  get writer() {
    return this._author;
  }
  // setter
  set writer(updatedAuthor) {
    this._author = updatedAuthor;
  }
}
const novel = new Book('anonymous');
console.log(novel.writer);	//anonymous
novel.writer = 'newAuthor';
console.log(novel.writer);	//newAuthor

위와 같이 사용할 수 있다. java랑 다른점은 getter, setter를 쓸 때 메소드처럼 쓰지 않는다는 것이다. 또한, set을 할 때도 메소드를 가져오는 것이 아닌 그냥 변수명을 저장하듯이 저장한다.

 

 

Create a Module scriptd

javascript는 주로 HTML 웹에서 수행되는 작은 역할로 시작되었다. javascript를 더욱 모듈화하고, 깔끔하고, 유지 관리하기 쉽게 만들기 위해 ES6에서는 javscript 파일 간에 코드를 쉽게 공유하는 방법을 도입했다. 

<script type="module" src="filename.js"></script>

 

위와같이 모듈화하여 Export할 수 있다.

 

 

Use export to Share a Code Block

math_functions.js이라는 수학 연산과 관련된 여러 함수가 포함된 파일이 있다고 가정해보자. 해당 파일 안에는 아래와 같이 함수가 정의되어있고, 다른 파일과 공유하려면 해당 함수 앞에 export를 추가하면 된다.

export const add = (x, y) => {
  return x + y;
}
const add = (x, y) => {
  return x + y;
}

export { add };

위와같은 방법도 가능하다.

 

 

Reuse JavaScript Code Using import

이제 math_functions.js 파일을 공유하여 수학 연산은 가져와 사용할 수 있다.

import { add } from './math_functions.js';

위와 같이 java에서 사용할 때처럼 파일 directory와 파일명을 추가하여 import하면 사용할 수 있다. 단, 가져올 때 사용할 export한 함수명을 적어줘야 한다. export하는 방법은 Go가 강력한 것 같다. 함수를 대문자로만 바꿔주면되기 때문이다.

 

파일에 export된 모든 함수를 가져오려면 *를 사용하면 된다.

import * as myMathModule from "./math_functions.js";
myMathModule.add(2,3);
myMathModule.subtract(5,3);

위와 같이 선언해주고, 사용할 수 있다.

 

Create an Export Fallback with export default

내보내기 기본값이라는 또 다른 export 구문이 있다. 일반적으로 파일에서 하나의 값만 export하는 경우 이 구문을 사용한다고 한다. 또한, 파일이나 모듈에 대한 대체 값을 생성하는 데에도 사용된다고 한다.

export default function add(x, y) {
  return x + y;
}

export default function(x, y) {
  return x + y;
}

첫 번째는 명명된 함수이고, 두 번째는 익명 함수이다. 익명 함수를 사용할 수 있는 이유는 파일에서 1개의 함수만 export하기 때문이다.

 

 

Create a JavaScript Promise

javascript의 Promise는 비동기식으로 무언가를 약속할 때 사용한다. 작업이 완료되면 약속을 이행하거나 이행하지 못하게 된다. 생성자 함수이므로 생성하려면 Promise 키워드를 사용해야 한다. 구문은 아래와 같다.

const myPromise = new Promise((resolve, reject) => {

});

 

 

Complete a Promise with resolve and reject

Promise에는 pending, fulfilled, rejected 3가지 상태가 있다. 생성된 직후의 상태는 pending 상태이다. 이전의 코드의 경우 pending 상태가 지속하고있는 상태다. promise가 성공적으로 마무리되면 상태가 fulfilled로 변하고, resolve 함수를 호출한다. resolve 함수는 promise가 성공적으로 마무리된 결과를 전달한다. promise가 실패하면 rejected 상태로 변하고, reject 함수가 호출된다. reject 함수는 실패이유를 전달한다.  

const myPromise = new Promise((resolve, reject) => {
	//pending
  if(condition here) {
    resolve("Promise was fulfilled");	// fulfilled
  } else {
    reject("Promise was rejected");		// rejected
  }
});

사용 방법은 위와 같다.

 

 

Handle a Fulfilled Promise with then

이러한 promise는 시간이 걸리는 서버 요청이 있을 때 사용하면 유용하다. 이는 메소드를 사용하여 달성할 수 있다.

Promise.prototype.then(onFulfilled, onRejected)

이 then 메소드는  promise의 최종완료(완료 또는 거부)를 위한 콜백 함수를 예약한다. 약속이 이행되면 resolve를 호출, 거부되면 reject가 실행된다. 

myPromise.then(result => {
  
});

선언된 Promise를 위와 같이 사용할 수 있다.

const makeServerRequest = new Promise((resolve, reject) => {
  // responseFromServer is set to true to represent a successful response from a server
  let responseFromServer = true;
    
  if(responseFromServer) {
    resolve("We got the data");
  } else {  
    reject("Data not received");
  }
});

makeServerRequest.then(result => {
  console.log(result);
});

실제로 사용한 방법은 위와같다.

 

 

Handle a Rejected Promise with catch

myPromise.catch(error => {
  
});

위와 같이 then과 비슷한 방법으로 처리한다.

const makeServerRequest = new Promise((resolve, reject) => {
  // responseFromServer is set to false to represent an unsuccessful response from a server
  let responseFromServer = false;
    
  if(responseFromServer) {
    resolve("We got the data");
  } else {  
    reject("Data not received");
  }
});

makeServerRequest.then(result => {
  console.log(result);
});

makeServerRequest.catch(error => {
  console.log(error);
});

실제사용하면 위와같이 사용할 수 있다.

 

다 풀었는데,, ES6 기능이 보다 많은 것 같다. 이후에 프로젝트하면서 알아가도록 해야겠다.

 

 

Reference

'Javascript' 카테고리의 다른 글

Nest.js Pipes  (0) 2024.06.17
[Nest.js] Module  (0) 2024.06.11
기본 Javascript 문법  (0) 2024.06.04
왜 Javascript & Node.js를 사용할까?  (0) 2024.05.31

Javascript

HTML과 CSS가 페이지의 콘텐츠와 스타일을 제어하는 반면, 자바스크립트는 대화형 페이지를 만드는 데 사용된다. Javascript는 객체 지향 프로그래밍(OOP)과 함수형 프로그래밍(FP)을 모두 지원한다. 이는 JavaScript가 다중 패러다임 언어(multi-paradigm language)라는 것을 의미한다. 이러한 점에서 함수형 프로그래밍에 대한 이해도 필요하다.

 

 

주석

// This is an in-line coment.

/* This is a
multi-line coment */

/**
 * Your test output will go here
 */

 

변수 선언

undefined, null, boolean, string, symbol, bigint, number, object로 총 8가지 데이터 유형을 제공한다.

var myName;

위와 같이 변수를 선언할 수 있고, 변수 이름은 숫자, 문자 등으로 구성할 수 있지만, _공백을 포함하거나 숫자로 시작할 수 없다.

 

Javascript에서는 할당연산자()인 =를 사용하여 변수에 값을 저장할 수 있다. a변수에 7을 넣은 모습이다.

// Setup
var a;
a = 7;

할당연산자를 사용하여 변수에 값을 할당한 후 할당연산자를 사용하여 해당 변수의 값을 다른 변수에 할당할 수 있다. 변수 a와 b는 7의 값을 갖는다.

// Setup
var a;
a = 7;
var b;
b = a;

변수 선언된 것과 같은 줄에서 변수를 초기값으로 초기화하는 것이 일반적이다. 변수 a를 9인 var 값으로 초기화했다.

var a = 9;

문자열을 생성해보자. 아래  이름으로 초기화하여 변수를 선언했다.

var myFirstName = "YJ";
var myLastName = "K";

Javascript에서는 모든 변수와 함수 이름이 대소문자를 구분한다. 아래와 같이 camelCase로 가독성을 높일 수 있다.

// Variable declarations
var studlyCapVar;
var properCamelCase;
var titleCaseOver;

// Variable assignments
studlyCapVar = 10;
properCamelCase = "A String";
titleCaseOver = 9000;

var는 변수 선언을 쉽게 덮어쓸 수 있는 문제가 있다. 큰 프로젝트의 경우 변수 중 바뀌면 안되는 값이 의도치 않게 덮어쓸 수 있다. 이러한 문제를 발생시키지 않으려면 var 대신 let을 사용하면 된다.

let catName = "Oliver";
let catSound = "Meow!";

let대신 const를 사용하여 해결할 수도 있다. const는 상수 값으로 할당하면 재할당할 수 없다. (var, let, const에 대해서 더 알고싶다면 링크에서 이해하면 좋을 것 같다.)

const FCC = "freeCodeCamp"; // Change this line
let fact = "is cool!"; // Change this line
fact = "is awesome!";
console.log(FCC, fact); // Change this line

Number 숫자 데이터는 Javascript의 데이터 유형이다. 숫자 두 개를 사칙 연산을 통해 할당할 수 있다. 

const sum = 10 + 10;
const difference = 45 - 33;
const product = 8 * 10;
const quotient = 66 / 33;

연산자를 사용하여 변수에 변수를 쉽게 추가할 수 있다. 물론, 빼기도 가능하다.

let myVar = 87;

// Only change code below this line
myVar++;

소수를 할당할 수도 있다.

const myDecimal = 5.7;

물론, 사칙연산을 통해 할당도 가능하다.

const product = 2.0 * 2.5;
const quotient = 4.4 / 2.0;

나머지 연산도 가능하다.

const remainder = 11%3;

문자열을 정의할 때, "를 포함하여 초기화 하고 싶다다면 백슬레시를 사용하면 된다.

a "double quoted" string inside "double quotes".
const myStr = "I am a \"double quoted\" string inside \"double quotes\"."; // Change this line

"", '' 둘다 string 문자열을 만드는데 사용된다. ''안에 있는 ""는 백슬레시하지 않아도 된다.

const myStr = '<a href="http://www.example.com" target="_blank">Link</a>';

const goodStr = 'Jake asks Finn, "Hey, let\'s go on an adventure?"'; 
const badStr = 'Finn responds, "Let's go!"'; // 조심

문자열에서 escape할 수 있는 문자는 따옴표만이 아니다. 아래는 이스케이프 시퀀스를 정리한 표이다.

문자열은 뒤에 붙이는 것이 가능하다.

let a = "eonr";
a += "werwerefw";

string의 길이를 얻고싶다면, length를 사용하면 된다.

console.log("Alan Peter".length); // 10

문자열에 있는 문자한개를 배열처럼 가져올 수 있다.

const lastName = "Lovelace";
let firstLetterOfLastName = lastName[0];

배열은 문자열, 숫자 등 다른 타입도 혼합시킬 수 있다.

const myArray = ["abc", 123];

배열의 값은 수정할 수 있다.

const myArray = [18, 64, 99];
myArray[0] = 45;

배열에 추가하기 위해선 push를 사용하면 된다. 앞에 추가하려면 unshift()를 사용하면 된다.

const myArray = [["John", 23], ["cat", 2]];
myArray.push(["dog",3])

배열에 pop()하면 맨 마지막 값이 나온다. shift()하면 맨 앞에 값이 나온다.

const myArray = [["John", 23], ["cat", 2]];
const removedFromMyArray = myArray.pop();	// ["cat",2]
const removedFromMyArray = myArray.shift();	// ["John",23]

함수를 만들고 호출할 수 있다. return 값도 줄 수 있다.

function reusableFunction() {
  console.log("Hi World");
  return 5;
}

console.log(reusableFunction());

 

전역, 지역 변수를 설정할 수 있다.

var num1 = 18; // Global scope
function fun() {
  var num2 = 20; // Local (Function) Scope
  if (true) {
    var num3 = 22; // Block Scope (within an if-statement)
  }
}

===라는 연산자도 존재한다.

3 == '3' => true
3 === '3' => false

구조체를 만들 수 있다. number, string, array 등의 값을 가질 수 있다.

const myObj = {
  prop1: "val1",
  prop2: "val2"
};

구조체에 없는 속성을 추가하려면, 있는 것처럼 추가하면 된다.

const myDog = {
  "name": "Happy Coder",
  "legs": 4,
  "tails": 1,
  "friends": ["freeCodeCamp Campers"]
};

myDog.bark = "bow-wow";
console.log(myDog);
/*
{
  name: 'Happy Coder',
  legs: 4,
  tails: 1,
  friends: [ 'freeCodeCamp Campers' ],
  bark: 'bow-wow'
}*/

삭제하려면 delete `구조체이름.속성이름` 

// Setup
const myDog = {
  "name": "Happy Coder",
  "legs": 4,
  "tails": 1,
  "friends": ["freeCodeCamp Campers"],
  "bark": "woof"
};

// Only change code below this line
delete myDog.bark;
console.log(myDog);
/*
{
  name: 'Happy Coder',
  legs: 4,
  tails: 1,
  friends: [ 'freeCodeCamp Campers' ]
}
*/

반복문은 java랑 똑같은 것 같다. while도 java와 다를게 없다.

// Setup
const myArray = [];

// Only change code below this line
for(let i = 1; i <= 5; i++) {
  myArray.push(i);
}

기본 javascript 문제 풀이 완료

 

 

 

느낀점

확실히.. 함수 파라미터의 타입, return 타입을 지정하지 않는 부분에서 프로젝트가 커지는 경우 실수가 나올 수 있을 것 같은 느낌이 들었다. 이러한 부분이 보완되었다고 하니 그러한 장점을 사용하면 더 편리하게 코드를 작성할 수 있지 않을까 싶다.

 

 

Reference

'Javascript' 카테고리의 다른 글

Nest.js Pipes  (0) 2024.06.17
[Nest.js] Module  (0) 2024.06.11
ES6  (0) 2024.06.05
왜 Javascript & Node.js를 사용할까?  (0) 2024.05.31

 

서론

큰 기업의 경우 Spring을 많이 사용하는 듯하고, 커가는 기업의 경우 Node.js를 많이 사용하는 듯합니다. 그렇다면, Node.js는 왜 사용할까?

링크에 따르면 PayPal에서 Nodejs에 2명, Java 백엔드에 5명을 할당했지만, Nodejs가 더 빠르게 구현했다는 이야기가 존재합니다. 아래와 같은 크게 2가지 이유에서 Node.js를 사용한다고 생각합니다.
  1. 빠른 구현
  2. NETFLIX, Trello, LinkedIn과 같은 대규모 서비스에도 적합 (큰 기업도 많이 사용하네..?)

그렇다면, 왜? Java&Spring Framework는 유행하는데 Node.js는 유행하지않았을까?

단점

1. Java와 비교했을 때, Node.js는 작고 느린 Single Thread 서버이다.
Java는 각 HTTP 요청을 별도의 Thread에서 처리하지만, Node.js는 모든 요청을 하나의 Thread로 처리.
-> 즉, Java Spring은 여러 HTTP 요청을 동시에 처리할 수 있지만 Node.js의 경우 한번에 1개의 요청만 처리할 수 있습니다. 그렇기때문에 강력한 서버에 Node.js를 설치하더라도, 100%의 성능을 활용할 수가 없습니다.

2. Node.js가 사용하는 언어인 Javascript는 신기한(?) 언어다.
Java, script 두개가 합쳐졌지만 자바도 아니고, 단순히 스크립트 언어도 아니라고 합니다. 다른 고급 언어와는 다르게, 자바스크립트는 단순히 웹 브라우저 화면을 컨트롤 하는 스크립트 용도로 만들어진 언어입니다.

그렇기에 발전한 지금의 자바스크립트에는 간단해 보이는 코드 사이사이에 여러 혼란스러운 변화의 흔적들이 남아있습니다. (`this` keyword의 난해함, 혼란스러운 scope 개념 등..)

Javascript는 좋은 부분이 많은 언어이지만, 위험하고 나쁜 부분은 더 많은 언어로 `잘` 알아야 할 필요가 있습니다.

장점

1. Node.js는 (작고 가벼운) Single Thread 서버이다.
말이 아 다르고 어 다르다는 말처럼, Node.js 서버는 Java와 비교했을 때, 작고 느린것은 맞지만 작고 가볍다고 볼 수도 있습니다.

작고 가벼운 Node.js 서버는 대규모 트래픽을 받아주기에는 크게 유용하게 생각되지는 않았습니다.

하지만, Monolithic Architecture를 대체하여 관심받는 MSA(Micro Service Architecture) 구조와 서버 배포와 관리를 간단하고 빠르게 해줄 수 있는 k8s(kubernetes)가 유행을 탄 후, 상황은 조금 달라졌습니다.

MSA는 거대한 서버를 서비스 기능 별로 나눌 뿐만 아니라, 트래픽을 나눕니다. 예를 들어, 쇼핑몰 회사에서 2대로 모든 서비스 요청을 처리하고 있었다치면, MSA 구조에서는 이벤트 서버 2대, 상품 리스트/추천 서버 2대, 주문/배송 처리 서버 3대 등으로 나눠질 수 있습니다. 

얼핏 보았을 때, 2대 vs 7대로 비효율적으로 보이는 MSA 구조는 트래픽이 많이 몰릴 때 빛을 발합니다. 만약, 어떤 시간 한정 이벤트가 발생해서 이벤트 시간에만 사람이 100배로 증가한다면, 이벤트 서버만 증설해주면 트래픽을 문제없이 처리할 수 있습니다. 또한, 이런 증설은 트래픽을 감지한 k8s 시스템이 자동으로 진행해 줍니다. 뿐만아니라, Node.js의 서버 가동 시간은 1초 이내(java spring 서버 가동 시간은 10 ~ 20초 사이)로 갑자그러운 트래픽에 즉각적으로 대응하기에도 유리합니다.

Node.js는 작고 가벼운 장점이 있다고 했습니다. 이는 JVM위에서 구동되는 Java Spring은 Node.js에 비해 무겁다는 것을 의미합니다. 구체적인 예시를 들자면, 아무것도 하지 않는 Java Spring은 400MB 가량의 Memory를 사용하는데 반해, Node.js는 25MB 정도의 Memory만을 사용합니다. (참조 : 링크) 1대의 서버에서 약 375MB가 차이나는데, N대의 서버를 MSA 구조에서 사용한다면 N*375MB의 Memory가 차이가 날 것입니다.

최근 MSA와 k8s가 유행하며 서버 수 자체도 늘고, 서버 수가 트래픽에 맞춰 유동적으로 바뀌는 상황이 많아졌으며, 크고 강력한 한 대의 서버보다는 빠르고 가벼운 서버가 여러대 있는 쪽이 유리한 상황이 많아졌습니다. 이러한 상황에서 빠른 서버 가동 시간과 적은 Memory 사용량 등 Node.js의 가벼움은 빛을 발하고 있습니다.

처리 능력이 떨어지거나 하나의 thread만 사용해 응답성이 떨어지는 단점들은 서버를 여러대 두면 무마 가능하게 되었습니다. (Single Thread 서버 여러 대 == Multi Thread 서버 1대)

또한, Single Thread 서버의 장점이 있습니다. Single Thread 서버에는 오로지 하나의 thread만 존재하기 때문에, concurrency 지옥에서 고통 받을 필요가 없습니다.

2. Javascript 언어는 나아지고(!) 있다.
Javascript는 호불호가 갈리는 언어라고 합니다. Javasciprt의 가장 큰 단점 중 한 가지는 타입이 없기에, 타입을 강제할 방법이 없었다는 것 입니다.

예를 들어, javascript로 아래와 같이 함수를 짰다면
function plus(number1, number2)
{
    return number1 + number2;
}
우리는 함수를 사용하는 사람한테 number1, number2를 숫자로 쓰라고 강제할 수 없습니다. (어..? 이걸 하나하나 기억해야하나..)

함수 사용자가 아래와 같은 악랄한(!) 짓을 해도 딱히 막을 방법은 없습니다.
var result = plus('1', '2') // 3...! 다행이 이건 의도대로 작동합니다.
var result2 = plus('2', 'number') // '2number'? 우리가 원했던 결과는 아니네요
var result3 = plus(1, '2') // 12, 여기부터 심각하게 잘못된 결과가 나오기 시작합니다.
우리가 할 수 있는 최선은 주석을 길게 달아 사용자에게 제발 이 함수를 정확히 써달라고 아래와 같이 명시(!)하는 것 뿐입니다.
/**
 * @param {number} number1- 더하는 첫번째 수, 제발 숫자만 넣어주세요 ㅜㅜ
 * @param {number} number2- 더하는 두번째 수, 꼭 무조건 숫자만 ㅠㅠ;
 *
 * WARNING!!!! 숫자가 아닌 param을 넣으면 오작동함!!!!
 */
function plus(number1, number2) {
  // ...
}
하지만, 이러한 주석 속의 울부짖음을 무시할 사람은 너무나 많습니다. 소규모 프로젝트에서는 큰 문제가 되지 않았지만, javascript에도 많은 대규모 프로젝트들이 생기며, 이 문제는 심해져 갔습니다. 다행히, 지금은 Typescript가 나왔습니다.

Typescript는 아주 기발한 방법으로 (솔직히 말하면 조금 꼼수를 써서) Javascript를 Type이 존재하는 언어로 재탄생 시켰습니다.

아무튼, Typescript의 탄생으로 인해 Javascript도 type이 있는 interface를 개발자들에게 제공해 줄 수 있게 되었고, Javascript는 대규모 개발에는 어울리지 않는다는 오명도 조금은 벗을 수 있게 되었습니다.

Nest.js의 출시 역시 놓칠 수 없는 포인트입니다.

Java Spring이라는 Framework가 제공하는 DI, IoC 기반의 개발은 Java를 포기하기 힘들게 만드는 Spring의 큰 장점입니다. 하지만, 지금은 Nest.js의 출시로 인해, Javascript에서도 마치 Java Spring을 쓰는 것처럼 Annotation을 통해 편리하게 DI, IoC 기반의 개발을 할 수 있습니다.

그리고 Nest.js는 Typeorm이라는 ORM 프레임워크 역시 적극적으로 지원하고 있기에, 더더욱 Java Spring + JPA 과 같은 조합을 쓰는 느낌으로 Javascript(Nest.Js + Typeorm) 개발을 할 수 있습니다.

Nest.js에 대해 조금 더 자세히 알고 싶으시다면 링크를 통해 글을 참조해보셔도 좋을 것 같다고 합니다.

또한, Javascript 진영에도 Jest나 Mocha 같은 좋은 테스트툴이 나왔기에 DI, IoC 구조가 제공하는 장점 중 하나인 `유닛테스트의 편리함` 역시 잘 활용할 수 있게 되었습니다.

결론은, 서버 개발 언어로서의 javascript는 발전하고 있다는 것 입니다. 부족한 부분은 채워지고 있고(Typescript, Next.js) 개발 툴 역시 보강되고 있습니다. (Typeorm, Jest, Mocha)

위에서도 말했지만, `Javascript는 좋은 부분이 많은 언어이지만, 위험하고 나쁜 부분은 더 많습니다.
그렇지만 좋은 부분도 천천히, 하지만 확실하게 많아지고 있습니다.

 

네이버 파이낸셜의 페이플랫폼 직속 팀에서는 미래(PHP가 이끌던 백엔드 개발 트렌드를 Java Spring이 가져갔던 것처럼, 언젠가는 Node.js 역시 개발 트렌드를 주도)에 대비하여, 적극적으로 Node.js를 도입하고 노하우를 쌓아가고 있다고 합니다.

  • 네이버 쇼핑 구매 목록 API를 제공하는 타임라인 서버
  • 혜택 광고 API를 제공하는 리워드 서버
  • 카드 정보 API를 제공하는 간편 입력 서버
  • 마이데이터 API를 제공하는 마이데이터 서버

... 외 다양한 서버들을 Node.js(+ MSA, k8s)로 개발하고 운영하고 있다고 합니다. 또한, 대규모의 CPU 연산이 필요한 신규 DB 구축을 위한 마이그레이션 작업 역시 MSA 구조의 Node.js 서버로 처리해서, Node.js 서버로도 대규모 CPU 연산 작업이 가능하다는 것을 검증했고, 노하우를 쌓아가고 있다고 합니다.

 

 


내용들을 정리하며, Node.js에 대해 궁금해졌고 공부해보면 좋을 것 같다는 생각이 들었습니다. Java Spring을 경험해본 입장에서 비교해보며, 어떤 차이가 있는지 토이프로젝트를 진행해봐야겠습니다.

 

 

 

 

 

Reference

 

 

 

 

'Javascript' 카테고리의 다른 글

Nest.js Pipes  (0) 2024.06.17
[Nest.js] Module  (0) 2024.06.11
ES6  (0) 2024.06.05
기본 Javascript 문법  (0) 2024.06.04
 

프로그래머스

코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.

programmers.co.kr


  • 문제

문자열은 0-9의 숫자로 이루어져있고, 길이는 최대 7을 가진다.

 

해당 문자열의 숫자 조합으로 이루어진 소수의 개수를 구해야 한다.

 

 

  • 풀이

생각해낸 풀이는 아래와 같다.

1. 미리 boolean 배열을 통해 소수인지 아닌지 판별해놓는다. (최대 1000001 크기가 된다.)

2. backtracking을 통해 숫자를 하나씩 골라가며 String을 만들어준다. (visited를 체크하여 같은 index의 수가 중복 추가되지 않게 한다.)

3. 만들어진 수가 소수인지 판별하여 소수가 아니라면 HashSet에 추가한다. (HashSet을 사용하는 이유는 contains를 사용할 때 O(1)의 시간복잡도를 가지기 때문이다.)

코드 답안이 통과되고 다른 사람의 코드를 보며 깨달은 부분이 있다.

아래 부분에 추가했으니 궁금한 사람들은 보면 좋을 것 같다.

 

 

  • 코드
import java.util.*; 

class Solution {
    static boolean[] primes;
    static boolean[] visited;
    static Set<Integer> set;
    
    public static int solution(String numbers) {
        set = new HashSet<>();
        primes = new boolean[10000001];
        primes[0] = true;
        primes[1] = true;
        for(int i = 2; i < 10000001; i++) {
            for(int j = i+i; j < 10000001; j+=i) {
                if(primes[j]) continue;

                primes[j] = true;
            }
        }

        visited = new boolean[numbers.length()];
        backtracking(numbers, 0, "");

        return set.size();
    }

    public static void backtracking(String number, int depth, String s) {
        if(depth == number.length()) {
            if(s.equals("")) return;
            int realNumber = Integer.parseInt(s);
            if(primes[realNumber]) return;
            if(set.contains(realNumber)) return;

            //System.out.println(realNumber);
            set.add(realNumber);
            return;
        }

        backtracking(number, depth+1, s);
        for(int i = 0; i < number.length(); i++) {
            if(visited[i]) continue;

            visited[i] = true;
            backtracking(number, depth+1, s+number.charAt(i));
            visited[i] = false;
        }
    }
}

정확성에서 100이 나오긴 했지만, 시간이 너무 오래 걸리는 듯한 느낌이다.

 

다른 사람풀이를 구경해보자.

import java.util.HashSet;
class Solution {
    public int solution(String numbers) {
        HashSet<Integer> set = new HashSet<>();
        permutation("", numbers, set);
        int count = 0;
        while(set.iterator().hasNext()){
            int a = set.iterator().next();
            set.remove(a);
            if(a==2) count++;
            if(a%2!=0 && isPrime(a)){
                count++;
            }
        }        
        return count;
    }

    public boolean isPrime(int n){
        if(n==0 || n==1) return false;
        for(int i=3; i<=(int)Math.sqrt(n); i+=2){
            if(n%i==0) return false;
        }
        return true;
    }

        public void permutation(String prefix, String str, HashSet<Integer> set) {
        int n = str.length();
        //if (n == 0) System.out.println(prefix);
        if(!prefix.equals("")) set.add(Integer.valueOf(prefix));
        for (int i = 0; i < n; i++)
          permutation(prefix + str.charAt(i), str.substring(0, i) + str.substring(i+1, n), set);

    }

}

가장 많은 칭찬이 달린 풀이이다. 복사해서 붙여넣기 한다음 채점해보자.

나의 풀이보다 약 1/100의 시간이 걸리는 모습이다. 어디서 이런 차이가 발생할까??

 

소수를 구하는 약 O(n^2)의 2중 반복문이 많은 시간을 잡아먹는다.

import java.util.*; 

class Solution {
    
    public static int solution(String numbers) {
        boolean[] primes = new boolean[10000001];
        for(int i = 2; i < 10000001; i++) {
            for(int j = i+i; j < 10000001; j+=i) {
                if(primes[j]) continue;

                primes[j] = true;
            }
        }

        return 3;
    }

}

이를 테스트 해보기위해 위의 코드로 한번 돌려보았다. 

해당 코드에서 일단 많은 시간을 잡아먹는 모습이다. 생각보다 숫자의 종류가 많지 않기때문에 미리 소수인지 아닌지 구해놓기 보다는 하나의 숫자마다 소수인지 아닌지 판별하는 방식이 더 효율적이다.

 

서론

수평적 규모 확장성을 달성하기 위해서는 요청 또는 데이터를 서버에 균등하게 나누는 것이 중요하다. 안정 해시는 이 목표를 달성하기 위해 보편적으로 사용하는 기술이다. 하지만, 우선 이 해시 기술이 풀려고하는 문제부터 좀 더 자세하게 살펴보자.

 

해시 키 재배치(rehash) 문제

N개의 캐시 서버가 있다고 하자. 이 서버들에 부하를 균등하게 나누는 보편적 방법은 아래처럼 해시 함수를 사용하는 것이다. 이전에 봤던 기본적인 샤딩 방식과 동일하다.

serverIndex = hash(key)%N (N은 서버의 수)
해시 서버 인덱스
key0 18358617 1
key1 26143584 0
key2 181311146 2
key3 35863496 0
key4 34085809 1
key5 27581703 3
key6 38164978 2
key7 22530351 3

위는 총 4대의 서버를 사용할 때의 예시다. 

그림 5-1

그림 5-1은 표의 key가 어떻게 분산되는지 보여준다. 해당 방법은 Server pool의 크기가 고정되어 있을 때, 그리고 데이터 분포가 균등할 때는 잘 동작한다. 하지만 서버가 추가되거나 기존 서버가 삭제되면 문제가 생긴다. 예를들어, server1이 장애가 발생하여 동작할 수 없을 때, server pool의 크기는 3으로 변한다. 키에 대한 해시 값은 변하지 않지만 나머지 연산을 적용하여 계산한 서버 인덱스 값은 달라질 것이다. 따라서 그림 5-2와 같은 결과를 얻는다.

그림 5-2

장애가 발생한 1번 서버에 보관되어 있는 키 뿐만 아닌 대부분의 키가 재분배되었다. 1번 서버가 죽으면 대부분 캐시 클라이언트가 데이터가 없는 엉뚱한 서버에 접소갛게 된다는 뜻이다. 그 결과로 대규모 캐시미스가 발생하게 될 것이다. 안정 해시는 이 문제를 효과적으로 해결하는 기술이다.

 

안정 해시

테이블 크기가 조정될 때 평균적으로 오직 k/n개의 키만 재배치하는 해시 기술이다. k는 키의 개수, n은 슬롯(slot)의 개수다. 

해시 공간과 해시 링

해시 함수 f로는 SHA-1을 사용한다고 하고, 그 함수의 출력 값 범위는 x0, ...., xn과 같다고 가정하자. SHA-1의 해시 공간(hash space) 범위는 0부터 2^160-1 까지라고 한다. 따라서 xn은 2^160-1이다. 

그림 5-3
그림 5-4

그림 5-3인 해시 공간을 양쪽으로 구부려 접으면 그림 5-4와 같은 해시 링이 만들어진다.

 

해시 서버

해시 함수 f를 사용하면 서버 IP나 이름을 링 위의 어떤 위치에 대응시킬 수 있다. 

그림 5-5

그림 5-5는 4개의 서버를 해시 링 위에 배치한 결과다. 

 

해시 키

여기 사용된 해시 함수는 "해시 키 재배치 문제"에 언급된 함수와는 다르며, 나머지 연산을 사용하지 않고 있음에 유의하자.

그림 5-6

그림 5-6 같이, key 또한 해시 링의 어느 지점에 배치할 수 있다.

 

서버 조회

어떤 키가 저장되는 서버는, 해당 키의 위치로부터 시계 방향으로 링을 탐색해 나가면서 만나는 첫 번째 서버다.

그림 5-7

그림 5-7이 해당 과정을 보여준다. 

 

서버 추가

서버를 추가하더라도 키 가운데 일부만 재배치하면 된다.

그림 5-8

그림 5-8을 보면 새로운 서버4가 추가된 뒤에 key0만 재배치됨을 알 수 있다. 

 

서버 제거

하나의 서버가 제거되면 키 가운데 일부만 재배치된다. 

그림 5-9

그림 5-9를 보면 서버1이 삭제되었을 때, key1만이 server2로 재배치됨을 알 수 있다.

 

기본 구현법의 두 가지 문제

안정 해시 알고리즘은 MIT에서 처음 제안되었다. 그 기본 절차는 아래와 같다.

  • 서버와 키를 균등 분포(uniform distribution) 해시 함수를 사용해 해시 링에 재배치한다.
  • 키의 위치에서 링을 시계 방향으로 탐색하다 만나는 최초의 서버가 키가 저장될 서버다.

하지만, 이 접근법에는 두 가지 문제가 있다. 서버가 추가되거나 삭제되는 상황을 감안하면 파티션(partition)의 크기를 균등하게 유지하는 게 불가능하다는 것이 첫 번째 문제다. 여기서 파티션은 인접한 서버 사이의 해시 공간이다. 어떤 서버는 굉장히 작은 해시 공간을 할당 받고, 어떤 서버는 굉장히 큰 해시 공간을 할당 받는 상황이 가능하다는 것이다.

그림 5-10

그림 5-10은 s1이 삭제되는 바람에 s2의 파티션이 다른 파티션 대비 거의 2배로 커지는 상황을 보여준다. 2번째 문제는 키의 균등 분포(uniform distribution)를 달성하기가 어렵다는 것이다. 

그림 5-11

예를 들어, 서버가 그림 5-11같이 배치되어 있다고 해보자. 서버1과 서버3은 아무 데이터도 갖지 않는 반면, 대부분의 키는 서버2에 보관될 것이다.

 

이 문제를 해결하기 위해 제안된 기법이 가상 노드(virtual node) 또는 복제(replica)라 불리는 기법이다.

 

가상 노드 or 복제

실제 노드 또는 서버를 가리키는 노드로서, 하나의 서버는 링 위에 여러 개의 가상 노드를 가질 수 있다.

그림 5-12

그림 5-12를 보면 서버0과 서버1은 3개의 가상 노드를 갖는다. 서버0을 링에 배치하기 위해 s0 하나만 쓰는 대신 s0_0,  s0_1, s0_2인 가상 노드 3개를 사용했다. 따라서 서버는 1개가 아닌 여러 개 파티션을 관리해야 한다. 키의 위치로부터 시계방향으로 링을 탐색하다 만나는 최초의 가상 노드가 해당 키가 저장될 서버가 된다.

 

이렇게 가상 노드의 개수를 늘리면 키의 분포는 점점 더 균등해진다. 이유는 표준 편차(standard deviation)가 작아져서 데이터가 고르게 분포되기 때문이다. 링크에 따르면 100~200개의 가상 노드를 사용했을 경우 표준 편차 값은 평균의 5%~10%사이다. 가상 노드의 개수를 더 늘리면 표춘 편차의 값을 더 떨어진다. 타협적 결정(trade off)이 필요하다는 뜻이다. 그러니 시스템 요구사항에 맞도록 가상 노드 개수를 적절히 조정해야 할 것이다.

 

재배치할 키 결정

서버가 추가되거나 제거되면 데이터 일부는 재배치해야 한다. 

그림 5-13

그림 5-13처럼 서버4가 추가되었다고 해보자. 이에 영향받는 범위는 s4부터 s3까지이다. 즉, s3부터 s4 사이에 있는 키들을 s4로 재배치해야 한다.

그림 5-14

그림 5-14같이 s1이 삭제되면 s1부터 s0 사이에 있는 키들이 s2로 재배치되어야 한다.

 

마치며

이번에는 안정 해시가 왜 필요하며 어떻게 동작하는지를 살펴봤다. 안정 해시의 이점은 아래와 같다.

  • 서버가 추가되거나 삭제될 때 재배치되는 키의 수가 최소화된다.
  • 데이터가 보다 균등하게 분포하게 되므로 수평적 규모 확장성을 달성하기 쉽다.
  • 핫스팟(hotspot) 키 문제를 줄인다. 특정한 샤드(shard)에 대한 접근이 지나치게 빈번하면 서버 과부하 문제가 생길 수 있다.

안정 해시는 실제로 널리 쓰이는 기술이다. 그 중 유명한 것 몇가지를 예롤 들어보면 아래와 같다.

  • 아마존 다이나모 데이터베이스(AWS DynamoDB)의 파티셔닝 관련 컴포넌트
  • 아파치 카산드라(Apache Cassandra) 클러스터에서의 데이터 파티셔닝
  • 디스코드(Discord) 채팅 어플리케이션
  • 아카마이(Akamai) CDN
  • 매그레프(Meglev) 네트워크 부하 분산기

 


Reference

  • 가상 면접 사례로 배우는 대규모 시스템 설계 기초

서론

네트워크 시스템에서 처리율 제한 장치는 클라이언트 또는 서비스가 보내는 트래픽의 처리율(rate)을 제어하기 위한 장치다. HTTP를 예로 들면 이 장치는 특정 기간 내에 전송되는 클라이언트의 요청 횟수를 제한한다. API 요청 횟수가 제한 장치에 정의된 임계치(threshold)를 넘어서면 추가로 도달한 모든 호출은 처리가 중단(block)된다. 아래는 몇 가지 사례다.

  • 사용자는 초당 2회 이상 새 글을 올릴 수 없다.
  • 같은 IP 주소로는 하루에 10개 이상의 계정을 생성할 수 없다.
  • 같은 디바이스로는 주당 5회 이상 리워드(reward)를 요청할 수 없다.

이렇게 클라이언트의 요청 횟수를 제한하는 이유는 아래와 같다.

  • DoS 공격에 의한 자원 고갈을 방지한다. 예시를 들면, 트위터는 3시간 동안 300개의 트윗만 올릴 수 있도록 제한한다. 구글 독스 API는 사용자당 분당 300회의 read 요청만 허용한다. 
  • 비용을 절감한다. 추가 요청에 대한 처리를 제한하면 서버를 많이 두지 않아도 되고, 우선순위가 높은 API에 더 많은 자원을 할당할 수 있다. 아울러 처리율 제한은 제3자(third-party) API에 사용료를 지불하고 있는 회사들에게 매우 중요하다. 
  • 서버 과부하를 막는다. bot에서 오는 트래픽이나 사용자의 잘못된 이용 패턴으로 유발된 트래픽을 걸러내는데 처리율 제한 장치를 활용할 수 있다.

 

1단계 문제 이해 및 설계 범위 확정

처리율 제한 장치에는 여러가지 알고리즘이 있다. 각각의 장단점이 있으니 면접시에 소통하며 적절한 알고리즘을 설정해야 한다. 면접 시에 아래와 같이 의사소통을 나눌 수 있다.

 

면접자: 어떤 종류의 처리율 제한 장치를 설계해야 하나요? 클라이언트, 서버 중 어느측 제한 장치 입니까?

면접관: 서버측 API를 위한 장치를 설계한다고 가정합시다.

면접자: 어떤 기준을 사용해서 API 호출을 제어해야 하나요? IP주소를 사용해야 하나요? 아니면 사용자 ID? 아니면 다른 기준이 있습니까?

면접관: 다양한 형태의 제어 규칙을 정의할 수 있도록 하는 유연한 시스템 이어야 합니다.

면접자: 시스템 규모는 어느정도 인가요? 스타트업? 큰 기업인가요?

면접관: 시스템은 대규모 요청을 처리할 수 있어야 합니다.

면접자: 시스템이 분산 환경에서 동작해야 하나요?

면접관: 예

면접자: 처리율 제한 장치는 독립된 서비스인가요? 아니면 애플리케이션 코드에 포함될 수 있나요?

면접관: 그 결정은 본인이 해주시면 되겠습니다.

면접자: 사용자의 요청이 처리율 제한 장치에 의해 걸러진 경우 사용자에게 해당 사싱를 알려야 하나요?

면접관: 예

 

요구사항

  • 설정된 처리율을 초과하는 요청은 정확하게 제한한다.
  • 낮은 응답시간: 처리율 제한 장치는 HTTP 응답시간에 나쁜 영향을 주어서는 곤란하다. 
  • 가능한 한 적은 메모리를 써야 한다.
  • 분산형 처리율 제한 : 하나의 처리율 제한 장치를 여러 서버나 프로세스에서 공유할 수 있어야 한다.
  • 예외 처리 : 요청이 제한되었을 때는 그 사실을 사용자에게 분명하게 보여주어야 한다.
  • 높은 결함 감내성 : 제한 장치에 장애가 생기더라도 전체 시스템에 영향을 주어서는 안된다 

면접관과 의사소통을 토대로 위와 같은 요구사항을 정의할 수 있다.

 

2단계 개략적 설계안 제시 및 동의 구하기

 

처리율 제한 장치는 어디에 둘 것인가?

처리율 제한 장치의 위치는 클라이언트, 서버 모두 가능하다. 하지만, 클라이언트 측은 일반적으로 처리율을 제한하는 안정적인 장소가 되지 못한다. 클라이언트 요청은 쉽게 위변조가 가능하기 때문이다. 또한, 모든 클라이언트의 구현을 통제하는 것도 어려울 수 있다. 그렇기 때문에 서버 측에 두는 것이 바람직하다. 

그림 4-1

그림 4-1은 서버 측에 제한 장치를 두는 한 가지 방법이다.

그림 4-2

그림 4-2은 처리율 제한 장치를 API 서버에 두는 대신, 처리율 제한 미들웨어를 만들어 해당 미들웨어로 하여금 API 서버로 가는 요청을 통제하도록 하는 것이다. API 서버의 처리율이 초당 2개로 제한된 상황에서 3개이상 보낸 경우 그림 4-2와 같이 처리될 것이다. 

 

폭넓게 채택된 기술인 클라우드 마이크로서비스 인경우, 처리율 제한 장치는 API 게이트웨이라 불리는 컴포넌트에 구현된다. API 게이트웨이는 처리율 제한, SSL 종단, 사용자 인증, IP 허용 목록 관리 등을 지원하는 완전 위탁관리형 서비스로 클라우드 업체가 유지 보수를 담당하는 서비스다. 

 

그렇다면, 게이트웨이에 처리율 제한 장치를 두는 것이 정답일까? 아니다. 회사 별 기술 스택이나 엔지니어링 인력, 우선순위, 목표에 따라 달라질 수 있기 때문이다. 다만 일반적으로 적용될 수 있는 몇 가지 지침을 나열해 보면 아래와 같다.

  • 프로그래밍 언어, 캐시 서비스 등 현재 사용하고 있는 기술 스택을 점검하라. 현재 사용하는 프로그래밍 언어가 서버 측 구현을 지원하기 충분할 정도로 효율이 높은지 확인하라.
  • 사업 필요에 맞는 처리율 제한 알고리즘을 찾아라. 서버 측에서 모든 것을 구현하기로 했다면, 알고리즘은 자유롭게 선택할 수 있다. 하지만 제3 사업자가 제공하는 게이트웨이를 사용하기로 했다면 선택지는 제한될 수 있다.
  • 여러분의 설계가 마이크로서비스에 기반하고 있고, 사용자 인증이나 IP 허용목록 관리 등을 처리하기 위해 API 게이트웨이를 이미 설계에 포함시켰다면 처리율 제한 기능 또한 게이트웨이에 포함시켜야 할 수도 있다.
  • 처리율 제한 서비스를 직접 만드는 데는 시간이 든다. 처리율 제한 장치를 구현하기에 충분한 인력이 없다면 상용 API 게이트웨이를 쓰는 것이 바람직한 방법일 것이다.

 

처리율 제한 알고리즘

처리율 제한 알고리즘을 이후에 배우고 싶고, 면접에 대한 단계만 궁금하다면 아래 3단계로 넘어가길 바란다. (저도 정리하고 이후 필요시에 볼 예정입니다.)

 

이전에 말했 듯, 처리율 제한 알고리즘은 여러가지가 있고 각각 고유의 장단점이 존재한다. 종류 별로는 아래와 같다.

  • 토큰 버킷
  • 누출 버킷
  • 고정 윈도 카운터
  • 이동 윈도 로그
  • 이동 윈도 카운터

각각의 알고리즘의 장단점을 배워보자.

 

토큰 버킷 알고리즘

토큰 버킷은 지정된 용량을 갖는 컨테이너이다. 해당 버킷에는 사전 설정된 양의 토큰이 주기적으로 채워진다. 토큰이 꽉 찬 버킷에는 더 이상의 토큰은 추가되지 않는다. AWS와 스트라이프가 API 요청을 통제하기 위해 이 알고리즘을 사용한다.

 

토큰 버킷 알고리즘은 2개의 인자를 사용한다.

  • 버킷 크기 : 버킷에 담을 수 있는 토큰의 최대 개수
  • 토큰 공급률 : 초당 몇 개의 토큰이 버킷에 공급되는가?

그림 4-3

그림 4-3은 용량이 4인 버킷의 예시이다. 이미 꽉 차 있는데, 토큰이 온다면 유입된 토큰을 버리는 방식이다. 각 요청은 처리될 때마다 하나의 토큰을 사용한다. 요청이 도착하면 버킷에 충분한 토큰이 있는지 검사한다.

 

그렇다면, 버킷은 몇 개나 사용해야 할까? 이는 공급 제한 규칙에 따라 달라진다. 아래 사례를 살펴보자.

  • 통상적으로, API 엔드포인트마다 별도의 버킷을 둔다. 예를 들어, 사용자마다 하루에 한 번만 포스팅 할 수 있고, 친구는 150명까지 추가할 수 있고, 좋아요 버튼은 5번 까지만 누를 수 있다면, 사용자마다 3개의 버킷을 두어야 할 것이다 
  • IP 주소별로 처리율 제한을 적용해야 한다면, IP 주소마다 버킷을 하나씩 할당해야 한다.
  • 시스템의 처리율을 초당 10,000개 요청으로 제한하고 싶다면, 모든 요청이 하나의 버킷을 공유하도록 해야할 것이다.

토큰 버킷 알고리즘의 장단점으로는 아래와 같다.

  • 장점
    • 구현이 쉽다.
    • 메모리 사용 측면에서 효율적이다.
    • 짧은 시간에 집중되는 트래픽도 처리 가능하다. 남은 토큰이 있기만 하면 요청은 시스템에 전달될 것이다.
  • 단점
    • 버킷 크기와 토큰 공급률이라는 두 개의 인자를 가지고 있는데, 이 값을 적절하게 튜닝하는 것은 까다로운 일이다. (구현이 어렵다는 말 아닌가..?)

 

누출 버킷 알고리즘

토큰 버킷 알고리즘과 비슷하지만 요청 처리율이 고정되어 있다는 점이 다르다. 누출 버킷 알고리즘은 보통 FIFO로 구현한다. 

 

전자상거래 기업인 쇼피파이가 이 알고리즘으로 처리율 제한을 구현한다. 동작 원리는 아래와 같다.

  • 요청이 도착하면 큐가 가득 차 있는지 본다.
    • 빈자리가 있는 경우에는 큐에 요청을 추가한다.
    • 가득 차 있다면 새 요청을 버린다.
  • 지정된 시간마다 큐에서 요청을 꺼내어 처리한다.

그림 4-4

그림 4-4는 누출 버킷 알고리즘을 도식화한 것이다. 누출 버킷 알고리즘은 토큰 버킷과 같이 아래 2개의 인자를 사용한다.

  • 버킷 크기 : 큐 사이즈와 같은 값이다.
  • 처리율 : 저징된 시간당 몇 개의 항목을 처리할지 지정하는 값이다. 보통 초 단위로 표현한다.

장단점으로는 아래와 같다.

  • 장점
    • 큐의 크기가 제한되어 있어 메모리 사용량 측면에서 효율적이다.
    • 고정된 처리율을 가지고 있기 때문에 안정적 출력이 필요한 경우에 적합하다.
  • 단점
    • 단시간에 많은 트래픽이 몰리는 경우 큐에는 오래된 요청들이 쌓이게 되고, 그 요청들을 제때 처리 못하면 최신 요청들은 버려지게 된다.
    • 두 개 인자를 가지고 있는데, 이들을 올바르게 튜닝하기가 까다로울 수 있다.

 

고정 윈도 카운터 알고리즘

 

고정 윈도 카운터 알고리즘은 아래와 같이 동작한다.

  • 타임라인(timeline)을 고정된 간격의 윈도(window)로 나누고, 각 윈도마다 카운터를 붙인다.
  • 요청이 접수될 때마다 이 카운터의 값은 1씩 증가한다.
  • 이 카운터의 값이 사전에 설정된 임계치(threshold)에 도달하면 새로운 요청은 새 윈도가 열릴 때까지 버려진다.

그림 4-5

그림 4-5에서 시간 단위는 1초이다. 시스템은 초당 3개까지의 요청만을 허용하고, 매초마다 열리는 윈도에 3개 이상의 요청이 밀려오면 초과분은 그림 4-5에 보인대로 버려진다. 

 

이 알고리즘의 가장 큰 문제는 윈도의 경계 부근에 순간적으로 많은 트래픽이 집중될 경우 윈도에 할당된 양보다 더 많은 요청이 처리될 수 있다는 것이다. 아래 그림 4-6을 살펴보자.

그림 4-6

그림 4-6은 분당 최대 5개의 요청만을 허용하는 시스템이다. 카운터는 매 분마다 초기화 된다. 위를 보면 2:00:00와 2:01:00 사이에 5개의 요청이 들어왔고, 2:01:00과 2:02:00 사이에 또 5개의 요청이 들어왔다. 윈도 위치를 조금 옮겨 2:00:30부터 2:01:30까지의 1분 동안을 보면, 1분동안 처리한 요청은 10개이다. 허용 한도의 2배가 되는 것이다. 

 

장단점으로는 아래와 같다.

장점

  • 메모리 효율이 좋다.
  • 이해하기 쉽다.
  • 윈도가 닫히는 시점에 카운터를 초기화하는 방식은 특정한 트래픽 패턴을 처리하기에 적합하다.

단점

  • 윈도 경계 부근에서 일시적으로 많은 트래픽이 몰려드는 경우, 기대했던 시스템의 처리 한도보다 많은 양의 요청을 처리하게 된다.

 

이동 윈도 로깅 알고리즘

앞서 살펴본 고정 윈도 카운터 알고리즘에서의 단점을 해결하는 알고리즘이다.

동작 원리는 아래와 같다.

  • 요청의 타임스탬프(timestamp)를 추적한다. 타임스탬프 데이터는 보통 레디스(Redis)의 정렬 집합(sorted set) 같은 캐시에 보관한다.
  • 새 요청이 오면 만료된 타임스탬프는 제거한다. 만료된 타임스탬프는 그 값이 현재 윈도의 시작 시점보다 오래된 타임스탬프를 말한다.
  • 새 요청의 타임스탬프를 로그(log)에 추가한다.
  • 로그의 크기가 허용치보다 같거나 작으면 요청을 시스템에 전달한다. 그렇지 않은 경우에는 처리를 거부한다.

그림 4-7

그림 4-7를 살펴보자.

  • 요청시간이 1:00:01에 도착했을 때, 로그는 비어있는 상태이므로 요청이 시스템에 전달된다.
  • 요청시간이 1:00:30에 도착했을 때, 타임스탬프가 로그에 추가된다. 직후 크기는 2이며, 허용 한도보다 크지 않기 때문에 요청이 시스템에 전달된다.
  • 요청 시간이 1:00:50에 도착했을 때, 타임스탬프가 로그에 추가된다. 직후 크기는 3이며, 허용 한도보다 크기 때문에 요청이 시스템에 전달되지 않는다.
  • 요청 시간이 1:01:40에 도착했을 때, 타임스탬프가 로그에 추가된다. [1:00:01, 1:00:30]은 1분이 지났기 때문에 만료되었기 때문에 삭제한다. 삭제 직후 로그의 크기는 2이며, 허용 한도보다 크지 않기 때문에 요청이 시스템에 전달된다.

장단점을 살펴보자.

장점

  • 알고리즘이 구현하는 처리율 제한 메커니즘이 매우 정교하다. 

단점

  • 알고리즘이 다량의 메모리를 사용한다. 거부된 요청의 타임스탬프도 보관되기 때문이다.

 

이동 윈도 카운터 알고리즘

고정 윈도 카운터 알고리즘과 이동 윈도 로깅 알고리즘을 결합한 알고리즘

해당 알고리즘을 구현하는데는 2가지 접근법이 사용될 수 있는데, 책에는 1가지만 설명하고 다른 하나는 참고문헌을 언급한다. 

그림 4-8

그림 4-8은 분당 7개 요청으로 설정되어 있다. 이전 1분 동안 5개의 요청이, 그리고 이후 1분동안 3개의 요청이 왔다고 가정되어 있다. 현재 1분의 30% 시점에 도착한 새 요청의 경우, 현재 윈도에 몇 개의 요청이 온 것으로 보고 처리해야 할까? 아래와 같이 계산한다.

  • 현재 1분간의 요청 수 + 직전 1분간의 요청 수 * 이동 윈도와 직전 1분이 겹치는 비율
  • 위의 공식대로 하면, 현재 윈도에 들어있는 요청은 3+5*70%=6.5개다. 반올림, 반내림하여 쓸 수 있는데, 본 예제에서는 내림하여 쓴다고 한다. 따라서 값은 6이다.

현재 1분의 30% 시점에 도착한 신규 요청은 시스템으로 전달될 것이다. 하지만 그 직후에는 한도에 도달하였으므로 더 이상의 요청은 받을 수 없다.

 

장단점을 살펴보자.

장점

  • 이전 시간대의 평균 처리율에 따라 현재 윈도의 상태를 계산하므로 짧은 시간에 몰리는 트래픽에도 대응 가능하다.
  • 메모리 효율이 좋다.

단점

  • 직전 시간대에 도착한 요청이 균등하게 분포되어 있다고 가정한 상태에서 추정치를 계산하기 때문에 다소 느슨하다. 하지만, 이 문제는 크게 심각하지는 않다. 클라우드플레어가 실시했던 실험에 따르면 40억 개의 요청 가운데 시스템의 실제 상태와 맞지 않게 허용되거나 버려진 요청은 0.003%에 불과했기 때문이다.

 

개략적인 아키텍처

처리율 제한 알고리즘의 기본 아이디어는 단순하다. 얼마나 많은 요청이 접수되었는지를 추적할 수 있는 카운터를 추적 대상별로 두고(사용자? IP?, API 엔드포인트? 서비스 단위?), 이 카운터의 값이 어떤 한도를 넘어서면 한도를 넘어 도착한 요청은 거부하는 것이다.

 

그렇다면, 이 카운터응 어디에 보관하는 것이 적당할까? 데이터베이스는 디스크 접근 때문에 느려 사용하면 안 된다. 메모리상에서 동작하는 캐시가 바람직한데, 빠른데다 시간에 기반한 만료 정책을 지원하기 때문이다. 일례로 레디스는 처리율 제한 장치를 구현할 때 자주 사용되는 메모리 기반 저장장치로서, INCR과 EXPIRE의 두 가지 명령어를 지원한다.

  • INCR : 메모리에 저장된 카운터의 값을 1만큼 증가시킨다.
  • EXPIRE : 카운터에 타움아웃 값을 설정한다. 설정된 시간이 지나면 카운터는 자동으로 삭제된다.

그림 4-9

그림 4-9는 처리율 제한 장치의 개략적인 구조이다.

 

3단계 상세 설계

그림 4-9의 개략적 설계를 봐서는 아래와 같은 사항은 알 수가 없다.

  • 처리율 제한 규칙은 어떻게 만들어지고 어디에 저장되는가?
  • 처리가 제한된 요청들은 어떻게 처리되는가?

해당 절에서는 처리율 제한 규칙에 관한 질문부터 답한 후, 처리가 제한된 요청의 처리 전략을 살펴본다. 그리고 마지막으로 분산 환경에서의 처리율 제한 기법에 대해서도 살펴보고, 구체적인 설계와 성능 최적화 방안, 모니터링 방안까지 살펴볼 것이다.

 

처리율 제한 규칙

리프트(Lyft)는 처리율 제한에 오픈 소스를 사용하고 있다. 이 컴포넌트를 들여다보고, 어떤 처리율 제한 규칙이 사용되고 있는지 살펴보자.

domain : messaging
descriptors :
	- key : message_type
	  value : marketing
	  rate_limit :
	  	unit : day
	  	requests_per_unit: 5

위의 예제는 시스템이 처리할 수 있는 마케팅 메시지의 최대치를 하루 5개로 제한하고 있다. 아래는 또 다른 규칙의 사례다.

domain : auth
descriptors :
	- key : auth_type
	  value : login
	  rate_limit :
	  	unit : minute
	  	requests_per_unit: 5

위 규칙은 클라이언트가 분당 5회 이상 로그인 할 수 없도록 제한하고 있다. 이런 규칙들은 보통 설정 파일(configuration file) 형태로 디스크에 저장된다.

 

처리율 한도 초과 트래픽의 처리

어떤 요청이 한도 제한이 걸리면 API는 HTTP 429 Status Code(too many requests)를 클라이언트에게 보낸다. 경우에 따라서는 한도 제한에 걸린 메시지를 나중에 처리하기 위해 큐에 보관할 수도 있다. 예를 들어, 어떤 주문이 시스템 과부하때문에 한도 제한에 걸렸다고 해보자. 해당 주문들은 보관했다가 나중에 처리할 수도 있을 것이다.

 

처리율 제한 장치가 사용하는 HTTP Header

클라이언트는 자기 요청이 처리율 제한에 걸리고 있는지를(throttle) 어떻게 감지할 수 있을까? 자기 요청이 처리율 제한에 걸리기까지 얼마나 많은 요청을 보낼 수 있는지 어떻게 알 수 있을까? 답은 HTTP 응답 헤더에 있다. 

  • X-Ratelimit-Remaining : 윈도 내에 남은 처리 가능 요청의 수
  • X-Ratelimit-Limit : 매 윈도마다 클라이언트가 전송할 수 있는 요청의 수
  • X-Ratelimit-Retry-After : 한도 제한에 걸리지 않으려면 몇 초 뒤에 요청을 다시 보내야 하는지 알림

사용자가 너무 많은 요청을 보내면 429 too many requests 오류를 X-Ratelimit-It-Retry-After 헤더와 함께 반환하도록 한다.

 

상세 설계

4-10

그림 4-10은 상세한 설계 도면이다.

  • 처리율 제한 규칙은 디스크에 보관한다. 작업 프로세스(workers)는 수시로 규칙을 디스크에서 읽어 캐시에 저장한다.
  • 클라이언트가 요청을 서버에 보내면 요청은 먼저 처리율 제한 미들웨어에 도달한다.
  • 처리율 제한 미들웨어는 제한 규칙을 캐시에서 가져온다. 아울러 카운터 및 마지막 요청의 타임스탬프를 레디스 캐시에서 가져온다. 가져온 값들에 근거하여 해당 미들웨어는 API 서버로 클라이언트의 요청을 보낼지, 클라이언트에게 429 응답할지 선택한다.

 

분산 환경에서의 처리율 제한 장치의 구현

단일 서버를 지원하는 처리율 제한 장치를 구현하는 것은 어렵지 않다. 하지만 여러 대의 서버와 병렬 스레드를 지원하도록 시스템을 확장하는 것은 또 다른 문제다. 아래 2가지 어려운 문제를 풀어야 한다.

  • 경쟁 조건 (race condition)
  • 동기화 (synchronization)

경쟁조건

처리율 제한 장치는 대략적으로 아래와 같이 동작한다.

  1. 레디스에서 카운터의 값을 읽는다.
  2. counter+1의 값이 임계치를 넘는지 본다.
  3. 넘지 않는다면 레디스에 보관된 카운터 값을 1만큼 증가시킨다.

하지만, 병행성이 심한 환경에서는 그림 4-11 같은 경쟁 조건 이슈가 발생할 수 있다.

그림 4-11

레디스에 저장된 counter의 값을 비슷한 시간대에 2개의 스레드에서 병렬적으로 counter의 값을 읽고 처리할 때 문제가 발생할 수 있다. 이때, 가장 널리 알려진 해결책은 락(lock)이다. 하지만, 락은 시스템의 성능을 상당히 떨어뜨린다는 문제가 있다. 위 설계의 경우에는 lock대신 쓸 수 있는 해결책이 2가지 있다.

  1. 루아 스크립트(Lua Script)
  2. 정렬 집합(sorted set)이라 불리는 Redis 자료구조 사용

두 전략에 대해 궁금하다면 링크를 통해 공부하자. 링크1, 링크2 

 

동기화 이슈

동기화는 분산 환경에서 고려해야 할 중요한 요소이다. 수백만 사용자를 지원하려면 한 대의 처리율 제한 장치 서버로는 충분하지 않을 수 있다. 그렇기때문에 처리율 제한 장치 서버를 여러 대 두게 되면 동기화가 필요해진다.

그림 4-12

예를들어, 그림 4-12의 왼쪽 그림의 경우 클라이언트 1은 제한 장치 1에 요청을 보내고 클라이언트 2는 제한 자치 2에 요청을 보내고 있다. 웹 계층은 무상태(stateless)이므로 클라이언트는 그림 4-12의 오른쪽 그림처럼 각기 다른 제한 장치로 보내질 수 있다. 이때 동기화를 하지 않는다면 제한 장치 1은 클라이언트 2에 대해서는 아무것도 모르므로 처리율 제한을 올바르게 수행할 수 없을 것이다. 

 

이에 대한 1가지 해결책은 고정 세션(sticky session)을 활용하여 같은 클라이언트로부터의 요청은 항상 같은 처리율 제한 장치로 보낼 수 있도록 하는 것이다. 하지만 이 방법은 추천하고 싶지 않은데, 규모면에서 확장 가능하지도 않고 유연하지도 않기 때문이다. 

그림 4-13

더 나은 해결책으로는 그림 4-13 같이 레디스와 같은 중앙 집중형 데이터 저장소를 쓰는 것이다. 

 

성능 최적화

지금까지 살펴본 설계는 2가지 지점에서 개선이 가능하다.

 

우선, 여러 데이터센터를 지원하는 문제는 처리율 제한 장치에 매우 중요한 문제라는 것을 상기하자. 데이터센터에서 멀리 떨어진 사용자를 지원하려다보면 지연시간(latency)이 증가할 수 밖에 없기 때문이다. 대부분의 클라우드 서비스 사업자는 세계 곳곳에 에지 서버(edge server)를 심어놓고 있다. 사용자의 트래픽을 가장 가까운 에지 서버로 전달하여 지연시간을 줄인다.

 

2번째로, 제한 장치 간에 데이터를 동기화할 때 최종 일관성 모델(eventual consistency model)을 사용하는 것이다. 이 일관성 모델이 생소하다면, 이후 6장 "키-값 저장소 설계"의 "데이터 일관성" 항목을 참고하도록 하자. (나도 생소하기 때문에 이후에 확인해봐야겠다.)

 

모니터링

처리율 제한 장치를 설치한 이후에는 효과적으로 동작하고 있는지 보기 위해 데이터를 모을 필요가 있다. 기본적으로 모니터링을 통해 확인하려는 것은 아래 2가지이다.

  • 채택된 처리율 제한 알고리즘이 효과적이다.
  • 정의한 처리율 제한 규칙이 효과적이다.

예를들어, 처리율 제한 규칙이 너무 빡빡하게 설정되었다면 많은 유효 요청이 처리되지 못하고 버려질 것이다. 이러한 현상이 일어난다면 규칙을 완화할 필요가 있다. 또한, 깜짝 세일 같은 이벤트 때문에 트래픽이 급증할 때 처리율 제한 장치가 비효율적으로 동작한다면, 특정 트래픽 패턴을 잘 처리할 수 있도록 알고리즘을 바꾸는 것을 고려해봐야 한다. 이러한 상황에서는 토큰 버킷이 적합할 것이다.

 

이처럼 모니터링을 통해 서비스의 질을 향상시킬 수 있다.

 

 

4단계 마무리

살펴본 처리율 제한 알고리즘은 아래와 같다.

  • 토큰 버킷
  • 누출 버킷
  • 고정 윈도 카운터
  • 이동 윈도 로그
  • 이동 윈도 카운터

알고리즘 이외에도 아키텍처, 분산환경에서의 처리율 제한 장치, 성능 최적화, 모니터링 등을 살펴보았다. 시간이 허락된다면 아래와 같은 부분을 언급해보면 도움이 될 것이다.

  • 경성(hard) 또는 연성(soft) 처리율 제한
    • 경성 처리율 제한 : 요청 개수는 임계치를 절대 넘어설 수 없다.
    • 연성 처리율 제한 : 요청 개수는 잠시 동안은 임계치를 넘어설 수 있다.
  • 다양한 계층에서의 처리율 제한
    • 이번 장에서는 애플리케이션 계층에서의 처리율 제한에 대해서만 살펴보았다. 하지만, 다른 계층에서도 처리율 제한이 가능하다. 예를들어, Iptables를 사용하면 IP 주소(3계층)에 처리율 제한을 적용하는 것이 가능하다. 
  • 처리율 제한을 회피하는 방법. 클라이언트를 어떻게 설계하는 것이 최선인가?
    • 클라이언트 측 캐시를 사용하여 API 호출 횟수를 줄인다.
    • 처리율 제한의 임계치를 이해하고, 짧은 시간 동안 너무 많은 메시지를 보내지 않도록 한다.
    • 예외나 에러를 처리하는 코드를 도입하여 클라이언트가 예외적으로 상황으로부터 우아하게 복구될 수 있도록 한다.
    • 재시도(retry) 로직을 구현할 때는 충분한 백오프(back-off) 시간을 둔다.

 

 

 

Reference

  • 가상 면접 사례로 배우는 대규모 시스템 설계 기초

+ Recent posts