티스토리 뷰

출처 : http://macrosystem.blog.me/130091966912


아직까지는 국내에서 Facebook Open API를 많이 활용하지 않아서 인지 몰라도 한글화된 자료가 많지는 않은 것 같다.

facebook의 5억명이 넘는 가입자풀과 더불어 제공되는 자원들을 활용해 봄으로써 현시점에 최대 규모의 이 서비스를 탐구해 보고자 한다.

아울러 필자가 한국통신대학교 평생대학원 이러닝학과 학생으로서 이러닝분야에 학습도구로 facebook의 open api를 어떻게 활용할 수 있을지 알아보도록 하겠다.

 

Facebook Open API를 활용하기 위한 모든 자료는 이곳에서 확인할 수 있으며, 강의내용 또한 이곳에 내용들을 요약정리하였다.

http://developers.facebook.com/

 

facebook을 활용한 개발 유형은 크게 3가지로 나눌 수 있으며, 유형에 따라 차시를 구분하였다.

 

1차시 : 자신의 사이트에서 facebook Open API 연동

2차시 : 강의, 모바일 app 개발

3차시 :  facebook.com 내에 app 개발

 

자 오늘 1차시 첫날로써, 자신의 사이트에서의 facebook Open API 연동에 대해 알아보도록 하겠다.

참고사이트 (http://developers.facebook.com/docs/guides/web)

 

1. 개요

Facebook Platform(이하 FP)는 자신의 웹사이트를 더욱 social화 하게 할 수 있다. 개발자는 제공된 Open API를 적절히 조합하고 적용하여 서비스 목적을 달성할 수 있다.

 

사용되고 있는 예제들을 통해 어떻게 활용이 되고 있는지 확인해보시기 바랍니다.

참고예제 : http://developers.facebook.com/showcase/

 

2. 주요 기능

 

1) Social Plugins

FP를 사용하는 가장 쉬운 방법으로 HTML 코드 한줄로 사이트내에 이식할 수 있다.

가장 중요한 social plugin은 'like button' 이다.

웹페이지에서 'like button'클릭시 해당 내용을 자신의 facebook에 포스팅 할 수 있다. 

 

사용방법은 페이지내에 다음의 코드를 삽입하면 된다.

다만, http://example.com 부분에 사이트 주소를 넣으면 된다.

 <iframe src="http://www.facebook.com/widgets/like.php?href=http://example.com"
       scrolling="no" frameborder="0"
       style="border:none; width:450px; height:80px"></iframe>

 

페이지에서 like button을 클릭한 사람들의 내용또한 확인 할 수 있다.

 

사용방법은. 페이지내에 다음의 코드를 삽입하면 된다.

 <iframe src="http://www.facebook.com/widgets/activity.php?site=example.com"/>

 

위의 코드를 삽입하면 다음과 같은 화면을 확인할 수 있다.

 

코드 삽입할 수 있는 방법으로 예제와 같이 iframe tag를 사용하는 것과 XFBML을 활용하는 방법이 있다. XFBML 이용을 위해서는 우선 facebook 상에 당신의 사이트를 등록한 후 id를 받아야 한다.

 

XFBML로 삽입할 경우 iframe에서는 사용할 수 없는 commenting 기능을 추가로 활용할 수 있으며 다음과 같은 형태로 나타난다.

 

Register your application은 이곳에서 할 수 있다.

ID 받는 곳 :  http://developers.facebook.com/setup/

 

다음 차시에서는 SSO(Single Sign On) 기능사용에 대해 알아보도록 하겠다.

 

1차시 첫째 강의 끝~~~

댓글
댓글쓰기 폼