Facebook Open Graph
Railscast정리.
< 다룰 내용 > Open Graph 프로토콜로 페이스북과 통합하는 방법. 로컬서버에 터널을 만들어 페이스북 커뮤니케이션을 백그라운드 프로세스로 돌리기.
< fb open graph이용한 기능 > 사용자가 어떤 포스트에 리뷰를 달면 페이스북에서 알림해주기. 사용자의 친구들도 리뷰를 읽고 또 그들의 리뷰를 남길 수 있음.
< 설명 > Open Graph Protocol은 앱의 어떠한 페이지든지 하나의 객체로 다룬다. 이를 통해 사용자들은 페이지와 상호작용하는 것이 가능. 페이지를 객체로 표현할 meta tags를 추가해야함. 페이스북은 이것을 분석해서 Graph API에서 객체로 사용가능하게 해준다.
테스트과정에서는 브라우저를 두개 열어서 나눠 사용하는것이 편리하다. 하나는 테스트유저로 다른 하나는 관리자로 설정변경하기 위해서.
Facebook의 Open Graph섹션에서 앱 설정 수정하기. 객체에 대한 액션을 정의. 우리 사이트에서 수행되는 액션들. 여기서는 영화모델에 대한 리뷰작성을 액션으로 정함.
People can [review] a [movie]. [Get Started버튼]
버튼을 누른 후, 액션에 대한 표현 여러가지 시제로 변경할 수 있고 커스터마이즈할 수 있는 페이지로 이동. 저장 후, 객체와 페이지를 수정하는 페이지로 이동. 여기서 우리 페이지의 meta tag들에 어떤속성이 필요하고 어떤 것을 선택적으로 사용할 수있는지 알 수 있다. 마지막 스텝은 집합. 사용자가 여러번의 액션을 수행할 경우, 예를 들어 여러개의 영화에 대한 리뷰를 다는 경우, 페이스북은 이들을 묶어줄 것이다. 우리가 할 것은 이 집합을 어떤 것에 초점을 맞출것인가 또 이 어떻게 보이게 할 것인지 레이아웃 및 기타 설정. 이과정이 끝나면, 우리앱에서 사용 가능한 액션과 객체를 갖게 된다.
우리가 이것들을 어떻게 사용할 수 있는지 몇가지 시연 예제들을 제공함.
See all your Review actions: curl 'https://graph.facebook.com/me/cinematron:review?access_to....
Create a new Review action: .. Delete a Review action: .. curl명령어는 post를 생성, 삭제 또는 모든 리뷰를 리스트할 수 있음 보여줌. 주목해야할 몇가지 사항. URL에 있는 cinematron:review. cinematron은 앱이름, review는 액션이름. 영화를 위한 URL에 대신 예제의 URL이 필요함. 이 주소로 접속하면 테그트할 수 있는 에제 객체 페이지로 옮겨짐. 소스코드 보기를 하면 head섹션에 Open Graph의 meta tags를 볼 수 있다. 오픈그래프의 객체로 다룰 수 있다는 의미.
우리앱에서 curl명령어 대신 Koala젬을 이용하려면, 콘솔창에서 해보기.
>> u = User.last >> u.facebook.put_connections("me", "cinematron:review", movie: "http://samples.ogp.me/4560699409725..") => {"id"=>"102048439040"}
User데이터를 가져와서 facebook통해 로그인하고, facebook메서드 이용 Koala 객체 인스턴스화 하기. 액션을 만들기 위해서, put_connections메서드를 호출하고 어떤것을 연결할 것인지 액션이름, 액션을 행하는 객체를 넘겨준다. 마지막 파라미터로는 앞서본 예제 영화의 URL을 넘긴다. 아이디를 돌려받으면 성공. /about/timeline url통해서 사용자의 타임라인에서도 확인가능.
Review 페이지 Open Graph객체로 만들기
섹션에 <%= yield :head %>만들기.
다시 페이지 리로드하면 소스들에 메타태그들을 볼 것임
문제, 로컬 서버인 우리의 컨텐츠를 페이스북이 접속하고 파싱하는게 불가능함. deploy하는 것이 어려우면 SSH tunneling이용하기.
localtunnel
$ gem install localtunnel 처음 실행시, -k 옵션 넘겨주기
$ localtunnel -k ~/.ssh/rsa_id.pub 3000
localtunnel.com에서 subdomain으로 이용가능. 이 터널을 닫거나 시간이 지나면 다른 도메인을 이용하게 되겠지만 공개된 것이므로 에러발생시 보여질 민감한 정보를 막기위해 프로덕션모드나 상연 환경모드 이용하길 바람.
Rails console에서 사용해보기. 샘플영화대신 tunnel도메인 이용해보기.
<우리 앱에 추가하기> 사용자가 "리뷰를 포스트할 때" 일어난다. 따라서 리뷰가 저장될때 current user가 있는지 체크하고 있다면, 콘솔창에서 한것을 해야함. user의 타임라인에 리뷰를 저장하기 위해.
if current_user current_user.facebook.get_connections("me", "cinematron:review", movie: movie_url(@movie)) end redirect_to @review.movie, notice: "Review has been created"
또다른 문제, 로그인후 리뷰를 남기면, Koala가 데이터를 받지못했다는 에러가 남. 페이스북이 어떤 이유로 우리 앱에 접근하지 못함. 이유! Single쓰레드 서버 in development. 페이스북이 우리서버에 접근해서 메타태그를 파싱해야하지만 우리앱은 아직 create액션 중이므로 두가지 액션이 불가능.
백그라운드 프로세싱으로 페이스북과 소통해야함.
예제에서는 gem 'delayed_job_active_record'이용.
오픈그래프가 잘 안먹히면 Facebook Debugger Tool이용하여 무슨잘못이 있는지 확인해보기.
