프록시 패턴, 프록시 서버, CORS, 이터레이터 패턴 간단 정리

프록시 패턴

다른 객체로 접근하는것을 통제하기 위해서 그 객체의 대리자를 제공하는 패턴

바빠서 그 일을 할 수 없는 메인 객체 대신 대리인 객체가 어느 정도 그 일을 처리해 줄 필요가 있거나,
다른 객체에 접근하기 위해 메인 객체는 은닉하고 대리인 객체를 두고자 하는 경우에 사용한다.

 

프록시 서버

프록시 객체가 클라이언트의 모든 요청을 받아 실제 객체의 서비스 접근을 흐름을 제어

 

 

 

 

CORS

CORS는 한 도메인 또는 Origin의 웹 페이지가 다른 도메인 (도메인 간 요청)을 가진 리소스에 액세스 할 수 있게하는 보안 메커니즘

- CORS 요청이 가능하려면 서버에서 특정 헤더인 Access-Control-Allow-Origin과 함께 응답할 필요가 있다.

 

같은 출처와 다른 출처의 구분

두 URL의 구성 요소 중 Scheme, Host, Port, 이 3가지만 동일하면 된다고 한다

 

https://evan-moon.github.io:80 기준

Scheme : https://

Host : evan-moon.github.io

Port : 80

https://evan-moon.github.io/2020/05/21/about-cors/

 

서버에서 해결 하지 못하는 경우 프론트에서 프록시 서버 두는 해결방법

예시 : http-proxy-middleware 라이브러리 사용

// /src/setupProxy.js

const { createProxyMiddleware } = require('http-proxy-middleware');

module.exports = function(app){
  app.use(
      createProxyMiddleware('프록시를 사용할 경로', {
          target: '프록시로 이용할 서버의 주소',
          changeOrigin: true
      })
  )
};

// app.use( ... ) 붙여서 여러개 사용 가능함!

 

 

 

버퍼 오버플로우 :: Buffer Overflow

버퍼(Buffer) 

- 데이터를 한 곳에서 다른 한 곳으로 전송하는 동안 일시적으로 그 데이터를 보관하는 메모리 영역

 

버퍼 오버플로우(Buffer Overflow)

- 프로세스가 데이터를 버퍼에 저장할 때 선언된 크기보다 더 큰 데이터를 기록함으로써

   프로그래머가 지정한 영역 외에 공간에 저장하는 것을 의미함

 

발생 원인

보통 데이터를 저장하는 과정에서 그 데이터를 저장할 메모리 위치가 유효한지를 검사하지 않아 발생함

주로 이 문제는 스택에서 발생하기 때문에 '스택 오버플로(Stack Overflow)'라고도 부른다

 

 

 

 

이터레이터 패턴

순회가 가능한 이터레이터(iterator)를 사용하여 요소들에 접근하는 디자인 패턴

for문을 추상화 한 패턴으로 무언가를 반복하여 순서대로 처리하는 경우 사용된다

 

이터레이터

이터레이터는 반복 처리가 가능한 객체

iterator는 next() 메소드를 가지고 있고, next 메소드는 아래의 규칙에 따라 구현되어야 한다.

1. next 메소드는 arguments 가 없다.
2. next 메소드의 반환자는 done: boolean 과 value: any 를 포함하는 object 를 반환해야 한다.
3. next 메소드의 반복이 끝날때 done 은 true 를 반환해야 한다.

[Symbol.iterator] 사용 예시

 

노출 모듈 패턴

모듈 패턴과 같은 개념으로 public과 private 메소드에 초점을 둔 패턴.

모듈 패턴과 달리 명시적으로 노출하고 싶은 부분만 정해서 노출하는 방식.

• 장점 : 명시적으로 public 메소드와 변수를 제공해 명시성을 높임
• 단점 : private 메소드 접근할 방법이 없어 private 메소드에 대해 함수 확장하는데 어려움이 있음

 

즉시 실행 함수를 통한 패턴 노츌모듈 패턴 예시

 

 

 

---

✔️ 참고

https://byounghee.tistory.com/20

https://blog.naver.com/PostView.naver?blogId=jvioonpe&logNo=220228050047 

https://xiubindev.tistory.com/115

https://velog.io/@maru5mango/%EB%94%94%EC%9E%90%EC%9D%B8-%ED%8C%A8%ED%84%B4-1iterator-%ED%8C%A8%ED%84%B4

https://evan-moon.github.io/2020/05/21/about-cors/