처음부터 댓글은 로그인 없이 누구나 작성할 수 있도록 만들려고 했다. [토스 테크](https://toss.tech/) 블로그에 있는 랜덤 프로필 생성 기능을 이곳에 적용해보고 싶었기 때문이다. 재밌어 보이기도 했고, 이렇게 만들면 댓글 참여율이 높아질 것 같았다.
만들고 나서 보니까, 댓글 삭제 기능도 넣고 싶더라. 댓글을 구분할 수 있는 id 값은 있지만, 해당 댓글을 작성한 사용자만이 삭제를 할 수 있게 만들어야 한다. 하지만 댓글은 사용자 인증 없이 작성할 수 있다. 그래서 사용자까지는 아니더라도, 해당 기기에서 작성한 댓글은 지울 수 있게 만들었다.
댓글 DB에 삭제 토큰 컬럼을 하나 추가하고, 로컬 스토리지에도 댓글 삭제용 토큰을 저장했다. 이렇게 하면 해당 기기(브라우저)에서는 내가 작성한 댓글을 삭제할 수 있다.
그런데 여기서 문제가 하나 있었다. 클라이언트단에서 삭제가 이뤄지다 보니, 다른 댓글의 삭제 토큰도 노출이 된다는 것이었다. 이러면 다른 사용자의 댓글도 삭제할 수 있게된다. 요청 주소, API 키, 그리고 삭제 토큰 모두 클라이언트에 노출 되어서, 직접 API 요청을 해버리면 다른 사용자의 댓글도 삭제 할 수 있는 것이다. API 계층에서는 보호가 되지 않았다.
인가 없이 댓글을 쓰게 만들어 놓고 삭제 기능을 구현하려니 이런 문제가 생긴 것이다. 😅 그냥 삭제를 빼버릴까 하다가, Supabase의 엣지 펑션을 사용하기로 결정했다. 클라이언트에서는 댓글 목록을 불러올 때, 삭제 토큰을 노출하지 않고 서버단에서 삭제 토큰을 사용하는 것이다. 무료 플랜 기준 월 50만 회까지 요청이 가능해 나쁘지 않다고 판단했다.
그래서 결국, 댓글은 누구나 작성할 수 있고, 적어도 해당 기기에서 작성한 댓글은 삭제할 수 있게 되었다.
1. 누구나 댓글을 작성, 삭제할 수 있게 만들고 싶었다.
2. 댓글 생성 시, 삭제용 토큰을 사용 기기에 저장(로컬 스토리지)해서 DB에 있는 댓글 삭제 토큰과 비교해서 삭제 할 수 있도록 구현했다.
3. 모든 것이 클라이언트에서 이뤄지다 보니, 내가 작성 안 한 댓글의 삭제 토큰도 볼 수 있었다.
4. API를 직접 호출하면 남의 댓글도 지울 수 있게 됐다.
5. 결국 댓글 목록을 불러올 때 삭제 토큰을 빼버렸고, Supabase의 엣지 펑션을 활용하여 삭제 검증을 서버단에서 처리하도록 만들었다.