쪽빛하늘

앞서 작성했던 글과 마찬가지로 구글에서 제공하는 Analytics API 예제(v3)를 사용해 쿼리를 작성하는 방법을 적어보려한다.

API로 원하는 값을 얻기 위해서는 계정 연동 이후, 쿼리를 정확히 보내야 한다.

쿼리를 무작정 만들어 보내는 것 보다 구글에서 계정 ID를 확인 하기에 유용했던 사이트 처럼 쿼리의 결과값을 확인하기에 좋은 사이트가 존재한다.

https://ga-dev-tools.appspot.com/query-explorer/

페이지를 가면 해당 화면을 확인 할 수 있다.

다만 조건은 현재 입력해 놓은 것이므로 다를 수 있는데, 쿼리에 보낼 ids는 위에 select a view 부분에서 사이트를 찾으면 변경 가능하다.

start-date와 end-date는 today, NdaysAgo와 같은 형식으로 사용 할 수 있으며, 정확한 날짜 입력을 원할 경우 YYYY-MM-DD형식으로 입력이 가능하다.

날짜 아래의 parameter들은 텍스트 박스를 누르면 셀렉트 박스처럼 변수들이 보이게 되는데, 여기서 원하는 변수를 골라 클릭하면 된다.

변수에 대한 설명은 아래 사이트에서 상세히 확인할 수 있다.

(사실 설명을 읽어도 바로 이해하기가 어려운 부분이 있어서 궁금하면 한 번 적용해보는게 확인이 더 빠른 것 같다.)

https://developers.google.com/analytics/devguides/reporting/core/dimsmets

그리고 Run Query라고 적힌 파란색 버튼을 누르면 화면 하단에 결과값이 확인된다.

구글로 보내진 쿼리와 쿼리로 받아온 결과값을 확인할 수 있다.

실제 예제에 쿼리를 작성하는 방법은 위의 화면으로 확인한 결과가 원하는 결과를 준다면 실제 예제에서 아래와 같이 적용할 수 있다.

날짜의 경우 차이가 있지만 '7daysAgo'대신 '2017-02-08'과 같이 값을 바꿔 넣으면 된다.

다면 sort에서 확인할 수 있듯이 문자입력시 이스케이프 문자를 넣어 '\문자'를 입력해주어야하는 것일 잊지 말자.

Google Analytics API를 사용하면서 가장 기초적으로 필요한 내용이 다양한 사이트 중 내가 원하는 사이트의 통계를 가져오는 것이다.

사이트를 하나만 관리할 경우 한 사이트의 통계만 가져오면 되므로 신경을 쓰지 않아도 되지만, 그렇지 않을 경우 원하는 사이트의 통계를 가져와서 확인을 해야한다.

제일 먼저 해야 할 일은 각 사이트의 VIEW ID를 가져오는 것이다.

VIEW ID의 경우 추적 ID와는 다르며, 숫자로만 이루어져있다.

https://ga-dev-tools.appspot.com/account-explorer/

위에 연결된 URL로 들어가면 다음과 같은 화면을 확인 할 수 있다.

Account, Property, View 세가지 셀렉트 박스가 있는데 원하는 사이트를 선택하면 아래에

Account, Property (Tracking ID), View, Table ID (ids)를 확인 할 수 있다.

여기서 기존에 제공되는 예제에서 변형하여 사용하기 위해서 필요한 것은 세번째에 있는 View에 있는 숫자로 된 ID이다.

예제 소스 중

해당 부분을 찾았으면 위의 View 값을 대체해서 넣으면 된다.

126번째 라인에 firstProfiledId에 보면 response에 첫번째 아이템의 아이디를 가져오도록 되어있다.

이 부분에 확인할 사이트의 View를 넣고 실행을 실행을 시키면 원하는 사이트의 통계가 나오는 것을 확인할 수 있다.

위의 예제대로 실행을 할 경우

예제를 확인하면 ID가 6066으로 끝나는 것을 확인 할 수 있다.

다른 사이트를 확인하기 위해 다른 사이트의 아이디를 넣으면

끝자리가 4766으로 끝나느 것을 확인 할 수 있다. 그리고 결과 값으로 나온 세션의 값도 달라진 것을 확인할 수 있다.

*) 개인적으로 다양한 사이트를 활용해서 사용할 경우 사이트 마다 매칭되는 각 변수를 만들어 변수에 화면의 View 값을 하나씩 넣어두고, 조건에 따라 넣어 사용하도록 하는 방식이 제일 유용하게 활용할 수 있는 방식이라 생각한다.

BOOK 셜록홈즈의 증명 「김재희, 박현주, 손선영, 윤해환, 홍성호」

다섯명의 작가가 셜록홈즈에 대해 쓴 단편 다섯개를 묶어놓은 책으로 작가 각각의 개성이 묻어나는 느낌이 들었다.

탐정의 결투_박현주

셜록의 로맨스_손선영

셜록 홈즈의 증명_홍성호

합정동 셜록 홈즈_김재희

성북동, 심우장 가는길_윤해환

위와 같은 제목과 작가로 이루어진 각각의 단편으로 이루어져 있었다.

탐정의 결투와 셜록의 로맨스는 홈즈가 주인공으로 나오는 소설로 홈즈가 탐정을 은퇴를 하고 난 뒤의 이야기를 다루고있다.

개인적으로 홈즈가 왓슨보다 먼저 죽는다고 알고있었던 부분과는 색다른 관점에서 볼 수 있어서 재미가 있었다.

(셜록 홈즈 소설에 홈즈가 살아있다고 생각할 수 있는 내용이 나오지만 죽었다고 공표되는 시점이 왓슨보다 먼저기에...)

셜록 홈즈의 증명과 합정동 셜록 홈즈의 경우 실제 셜록홈즈를 모델로 삼은 것이 아니라 홈즈를 동경하는 탐정이 사건을 해결하는 내용으로 내가 좋아하는 종류의 추리소설에 가까웠다. 개인적으로 사건이 발생하고 탐정이든 경찰이든 그 사건을 풀어가는 과정을 즐기기 때문에 아무래도 나는 탁상공론에 가까운 앞에 이야기보다는 이 두 이야기를 재밌게 읽을 수 있었다.

마지막 성북동, 심우장 가는길의 경우 완전 집중을 하면서 읽으면 좀 색다른 느낌을 받을 수 있는 내용이지 않을까 싶었다.

홈즈를 좋아하는 한 남자와 그 남자에게 관심을 가지게 되는 유부녀의 이야기로 둘은 한용운과 홈즈를 엮어 스토리를 만들어낸다.

각각 홈즈와 왓슨의 역할이 투시되는 인물인데, 내가 집중도 높게 읽지 못해서 그런지 그냥 읽히는대로 읽었다.

구글 애널리틱스는 구글에서 무료로 제공해주는 서비스로 웹사이트 통계 분석 프로그램 중 많은 사람들이 활용하고 있는 프로그램이다.

구글에서 신청만 한다고 사용할 수 있는 것이 아니라 웹사이트 소스에 직접 추적코드를 넣어야 사용할 수 있으며,

홈페이지 방문자 통계와 관련된 내용을 기간을 지정하거나, 실시간으로 확인할 수 있다.

구글 애널리틱스를 사용하기 위해서는 일단 구글 애널리틱스에 가입하는 것부터 시작해야한다.

https://www.google.com/analytics/

해당 페이지로 넘어갈 경우 가입과 관련 된 화면을 확인 할 수 있다.

이 화면에서 [가입] 버튼을 눌러 항목을 보면서 하나씩 채운다.

(이미 구글 애널리틱스를 사용하고 있어 가입 화면 확인이 불가해 화면은 없다.)

항목을 채운 화면 하단에 [추적 ID 가져오기] 버튼을 누르면 통계 분석을 하고자하는 홈페이지 소스에 넣을 스크립트 내용을 확인할 수 있다.

하지만 기존에 만들어진 계정에서 추적 코드를 알기 위해서는 당연히 가입 과정을 거친 이 방법으로는 확인을 할 수 없다.

이 경우 구글 애널리틱스 메인 화면에 들어가서 확인을 할 수 있다.

https://www.google.com/intl/ko_KR/analytics/

위 URL로 갈 경우

해당 화면에서 오른쪽 상단에 빨간색으로 줄 그어놓은 로그인을 눌러 화면을 이동한다.

(대시보드의 경우 자신이 설정할 수 있으므로, 간단하게 자주 확인하는 데이터가 있다면 대시보드에 넣어놓는 방법이 유용할 수 있다.)

왼쪽 화면 하단에 톱니바퀴 모양의 아이콘과 함께 있는 관리를 누를경우 홈페이지의 상세 설정 값을 확인 할 수 있는 화면으로 넘어가게 된다.

그리고 두 번째에 홈페이지 주소가 적혀있는 화면에서 추적 정보라고 적힌 부분을 누른다.

그러면 아래에 소메뉴가 보이게 되는데, 그 중에 추적코드를 선택하면 된다.

추적코드를 선택해 들어올 경우 위와 같은 화면을 확인할 수 있다.

이 화면에서 추적 ID와 추적 코드가 적힌 것을 확인 할 수 있으며, 웹사이트 추적이라고 적힌 부분 아래에 스크립트를 복사해서 홈페이지 스크립트에 넣으면 된다. 공통으로 사용하는 스크립트에 넣거나 화면을 불러올때 사용하는 스크립트에 넣어도 상관없다.

*) 개인적으로 JSP를 사용하여 예제를 만들어 봤기 때문에 PHP의 경우 설명에 따라 하면 될거라고 파악된다.

한 3일동안 아래 이미지로 보이는 오류로 인해 예제가 계속 되지 않았다.

https://developers.google.com/analytics/devguides/reporting/core/v3/quickstart/web-js

위의 URL로 들어가면 알겠지만 version 3 예제를 이용해보았다.

*) 현재는 version 4로 예제를 만들어보는 중이다. version 4 는 아래 URL로 확인할 수 있다.

https://developers.google.com/analytics/devguides/reporting/core/v4/quickstart/web-js

- Get https://~ 400 ()

- Refused to display '~' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

오류 내용을 찾기 위해 가장 먼저 확인했던 내용은 Client ID가 잘못되지 않았는지 확인하는 것이었다.

다른 종류의 API ID가 존재해서 혹시나 잘못된 것을 넣지 않았는지 확인했으나, 제대로 된 ID 값이 들어간 것을 확인 할 수 있었다.

다시 API Key 값을 만드는 것부터 확인하면서 찾아본 결과

위의 화면 중 리디렉션 URI에 표시한 부분에서 문제가 생겼었다.

저 URI가 내 프로젝트의 경로를 적는다고 생각을 하고, 프로젝트 경로(프로젝트 명)가 들어가 있었다.

다시 위와 같은 URI로 수정을 하고나니 아래와 같이 예제가 보이는 것을 확인 할 수 있었다.

이런 실수를 줄이기 위해 더 꼼꼼히 읽으면서 해봐야겠다.

구글 API는 한글로 된 설명이 적을 뿐더러 Analytics API를 활용한 한글 설명을 찾기가 힘들어 아쉽다.

조만간 API 사용 방법을 정리해서 올려야겠다.

javascript를 사용하다보면 alert나 log를 이용하여 변수의 값을 확인하고 싶어도 확인하지 못하는 경우가 종종 생긴다.

특히, [Object object]로 보여지는 경우를 자주 만나게된다.

자바의 경우 obj.toString() 이나 obj.toJSON()로 처리할 수 있지만 javascript에서 저렇게 간단하게 보여지지 않는다.

아래는 JSON을 만들어 값을 넘기면서 값이 제대로 들어갔는지 확인하기 위해 사용한 방법이다.

*) key의 경우 for문 안에서만 사용하는 변수이므로 어떤 변수명을 사용하더라도 무관하다.

obj의 경우 값을 알고자하는 object의 변수명을 적으면 된다.

위의 내용을 입력하고 실행시키면 콘솔창에 object 변수 내에 있는 변수명과 값들을 확인할 수 있다.

object내의 변수가 많을 경우 alert로 확인하는 것 보다 console.log로 확인하는 것이 한눈에 파악이 쉽다.

단, 확인이 끝날 경우 꼭 주석처리를 하거나 지우는 것을 잊지 말자!