개발 블로그를 시작할때 Velog를 선택한 이유는 간편함이었다.
별다른 복잡한 기능없이 간단해서 좋았지만 단점은 통계 기능의 부재였다..
물론 게시글마다 통계를 확인할 수 있지만 게시글 하나하나 들어가봐야 한다는 불편함이😒
나는 통계를 한눈에 보고싶단 말이다...!!!
그래서 통계 서비스를 만들어 보기로 했다.
Velog 살펴보기
Velog API
요청 URL: https://v2cdn.velog.io/graphql요청 메서드: POST
Rest API방식이 아닌 GraphQL을 사용하여 엔드포인트인 https://v2cdn.velog.io/graphql로 쿼리를 날리고 있었다. 덕분에 query를 원하는 데이터만 요청하도록 수정해 request를 보낼 수있었다.
태그
{
"operationName": "UserTags",
"variables": {
"username": "yevini118"
},
"query": "query UserTags($username: String) {\n userTags(username: $username) {\n tags {\n id\n name\n description\n posts_count\n thumbnail\n __typename\n }\n posts_count\n __typename\n }\n}\n"
}username으로 요청해 사용자의 태그 목록과 총 게시글 수 등등을 받아온다.
게시글
{
"operationName": "Posts",
"variables": {
"username": "yevini118",
"tag": null,
"cursor": "ebf3d8fe-ddc1-495b-8763-54e902c1094a"
},
"query": "query Posts($cursor: ID, $username: String, $temp_only: Boolean, $tag: String, $limit: Int) {\n posts(cursor: $cursor, username: $username, temp_only: $temp_only, tag: $tag, limit: $limit) {\n id\n title\n short_description\n thumbnail\n user {\n id\n username\n profile {\n id\n thumbnail\n __typename\n }\n __typename\n }\n url_slug\n released_at\n updated_at\n comments_count\n tags\n is_private\n likes\n __typename\n }\n}\n"
}Cursor Pagination 처리가 되어있는 듯 하다.variables에 cursor값을 주지않고 limit값을 주어 원하는 만큼의 게시글 목록을 받아올 수 있었다.
통계
{
"operationName": "GetStats",
"variables": {
"post_id": "8811a550-bcf3-426b-9c93-cc32020f51a5"
},
"query": "query GetStats($post_id: ID!) {\n getStats(post_id: $post_id) {\n total\n count_by_day {\n count\n day\n __typename\n }\n __typename\n }\n}\n"
}post_id로 요청해 해당 게시글의 총 조회수와 날짜별 조회수를 받아온다.
통계를 받아오기 위해서는 인증이 필요한데cookie에 access token을 담아 요청해야한다.
Velog 인증
위 request를 보내기 위해서는 username과 access token이 필요하다.
access token
사용자 인증에는 JWT 토큰을 사용하는데, access_token과 refresh_token 모두 쿠키에 담아 사용되고 있었다.
jwt.io 에서 확인해보니 access_token은 1시간 refresh_token은 한달 정도 유효기간을 두고 있었다.
username
사용자 로그인 이후 local storage에 CURRENT_USER키에 user_id, username, profile_image 등등 사용자 정보를 저장한다.
Access token 가져오기
결론적으로는 selenium로 웹 브라우저를 띄워 로그인을 진행하고 인증정보를 가져오기로 했다.
jsoup이 아닌 selenium을 선택한 이유가 몇가지 있었는데
velog는 이메일 과 SNS 로그인을 제공한다.
- 통합 로그인이 아니기 때문에 각 로그인 방식마다 request를 구현하기 번거로웠다.
- sns로그인을
jsoup로 진행하는게 가능한가...? redirect 때문에 가능한지 깊게 생각해보려다 말았다. - 로그인 폼을 내가 별도로 제작하는게 귀찮다.
- 사실 가능할지 시도는 안해봐서 모르겠다.
모든 구상은 끝났으니 개발만 진행하면 된다!!
마음에 걸리는 부분은..
태그, 게시글은 한번만 요청하면 되는 부분이지만 통계의 경우 게시글 만큼의 요청을 보내야 하기때문에 API endpoint에 부하를.. 줄..까..? (새발의 피가 아닐까)
몰랐는데 벨로그는 오픈소스로 공개가 되어있었다..!
그래도 개발자 도구로 필요한 정보를 얻었을것 같긴 하다ㅋㅋ
