[ router.beforeEach ]

기존에 SpringSecurity를 통해서 백엔드에서 인증을 못하면 수행하지 말아야 할 치명적인 에러는 막았다.

그런데 프론트 단에서도 생각을 해야 한다. 예를 들면 다음과 같다.

 

 

1) URI를 통해 직접 Get요청을 하게 되면 사용자의 이름과 page를 직접 입력한다.

    → RestFulAPI의 장점이자 단점이라고 생각한다. 자원에 대한 요청을 직관적으로 알 수 있어서

        개발 속도에 향상을 기여하지만 제대로 만들지 않으면 자원에 대한 요청을 직접 URI에 요청할

        수 있으므로 보안에 신경써야 할 것 같다.

 

2) 그 후 게시글 등록(GoTo Register)을 하면 오른쪽 이미지와 같이 정상적으로 처리가 된다.

 

3) 하지만 CRUD조작을 방지하기 위해서 필터단에서 인증이 안되면 401에러가 떨어지게 했다.

 

 

개선

분명히 데이터에 대한 조작은 이루어지지 않지만 논리적인 흐름이 잘못되었다. 굳이 Server를 들려서 데이터를

가져올 필요가 없는 페이지는 효율성을 위해서 프론트 단에서 처리하게 하려고 했다. 그에 대한 처리는

router.beforeEach를 통해서 해결했다. 코드는 다음과 같다.

 

 

1) JavaScript에서 Boolean은 0을 False로 처리한다. 그러므로 아이디 없으면 0으로 False처리하게 했다.

2) AuthenticatedList.includes(to.path)를 통해서 걸러야 할 페이지를 등록한다.

    → .includes는 ES5는 없다. ES6와 차이점이다.

 

해결

프록시 패턴은 접근에 대한 흐름을 가로채 해당 접근을  필터링하거나 수정하는 등의 역할을 하는 계층이다.

router.before도 프록시 패턴 중에 하나라고 생각한다.