게시판 즐겨찾기
편집
드래그 앤 드롭으로
즐겨찾기 아이콘 위치 수정이 가능합니다.
JSP)SNS 연동 소스 공개(Facebook 타임라인)
게시물ID : humorbest_820420짧은주소 복사하기
작성자 : 94년산수컷
추천 : 44
조회수 : 10421회
댓글수 : 0개
베스트 등록시간 : 2014/01/15 16:48:06
원본글 작성시간 : 2014/01/15 14:54:36
1.png
일반적인 페이스북 초기페이지입니다.
개발용으로 계정을 하나 더 만들었습니다.
3.png
계정생성이 끝나셨으면 https://developers.facebook.com/ 으로 들어가시면 상단과 같은 페이지가 나옵니다.
상단의 녹색 가입하기 버튼을 눌러주세요
4.png

가입하기 버튼을 누르시면 위와같은 레이어팝업이 나타납니다. 페이스북의 개인정보 취급방침에 동의하냐고 묻지만...
귀찮아서 읽지않고 체크후 계속하기를 눌러줍니다(다들그렇지않나요?...나만그런가)
5.png
계속하기 버튼을 누르시면 레이어팝업이 위와같이 변합니다
생성할 앱의 속성을 고르라고 합니다.
모두 체크 해제하시고 계속하기를 눌러주시면 됩니다.
7.png
6.png

이렇게 developers 가입이 끝났습니다.
페이스북에 가입후 휴대폰 인증을 하지 않으신 분은 developers 가입중 휴대폰인증이 필요하실겁니다.
4444.png
가입이 끝나셨으면 https://developers.facebook.com/apps 로 들어가 주세요
들어가시면 상단에 새앱만들기라는 파란색 버튼을 클릭해주시면 됩니다.
7.png
ㅂ버튼을 누르시면 상단과 같은 레이어 팝업이 나타납니다.
앱이름(영문자 + 숫자 조합 가능)
앱 네임 스페이스(소문자 7글자 이상)
을 적어주시고
앱 카테고리는 기타를 선택 후 계속 하기를 눌러줍니다.
8.png
계속하기를 누르시면 상단과 같은 자동가입방지 입력문자가 나타납니다.
가끔 알아보기힘들정도의 문자가 나타나는데 다른텍스트 시도하기버튼을 누르셔서 갱신하시면됩니다
자동방지 입력문자를 입력하시고 계속하기를 눌러줍시다.
9.png
이제 앱 생성이 끝났습니다.
앱 생성이 완료되시면 앱 정보 페이지로 가게 되는데
다시들어가시려면 https://developers.facebook.com 페이지 상단에 apps를 눌러주시면 다시 정보페이지로 갈 수 있습니다.
4444.png
apps 버튼을 누르게 되면 상단과 같은 페이지가 나타나는데요
생성한 앱이 여러개일수록 왼쪽의 앱메뉴가 늘어납니다.
여기서 상단에 있는 회색메뉴 Edit app 버튼을 눌러줍시다.
4444.png
앱 정보 페이지입니다.
상단의 앱 아이디와
앱 시크릿코드를 사용해야합니다.
어디도망가지않으니 적어두지 않으셔도 됩니다.
여기서 왼쪽에 Advenced 메뉴를 클립해주시면

12.png
위와같은 페이지가 나타납니다.
스크롤을 아래로 내리시다보면
13.jpg
이런부분이 있습니다. Valid OAuth redirect URIS 부분은 이 앱의 정보가 사용될 수 있는 페이지를 지정해주는부분입니다.
여러사이트를 지정 할 수 있습니다.
이제 JSP 소스부분입니다.
https://gist.github.com/holic940817/9d20db1a17e53502aa84#file-get_token-jsp
위링크로 가시면 제가 올려둔 소스를 보실 수 있습니다.
이해하기 쉽게 주석을 달아놨습니다.
이 소스를 이클립스로 컴파일 해보시면
(이상하게 이페이지는 파일이 jpg, png 확장자로 안올라가네요... gif 로 인코딩해서 화질구집니다)
16.gif
get token이라는 버튼이 보이실겁니다.
이버튼을 눌러주세요.
(사진이 세 확장자 모두 안올라가는관계로....)
이런 문구가 나타나실겁니다
"생성한앱이름" 에서 다음 정보를 받습니다: 회원님의 공개 프로필, 친구 리스트 그리고 상태업데이트
라는 문구와 함께 하단에 취소, 확인버튼이 있습니다.
확인버튼을 눌러주시면
16.png
15.png

위와같은 코드가 나타납니다.
제가 직접 홈페이지를 만들때는 토큰을 받는 모든페이지를 팝업으로 처리 후 부모창에 받아온 토큰값을 넘겨줍니다.
이렇게 받아온 토큰값에는 유효기간이 있습니다.
원래는 무제한 토큰이 있었는데 페이스북 개발자페이지가 개편되면서 토큰이 2개월짜리밖에 생성이 되지 않습니다.
이런방식으로 토큰을 DB에 저장한 후 2개월마다 갱신을 해줍니다.
 
 
일단 페이스북의 타임라인을 긁어오기전에
페이스북 페이지의 아이디를 알아야합니다.
제목 없음.png
제목 없음.png

페이스북 메인에서 상단 오른쪽의 톱니바퀴 모양을 클릭하신 후 계정설정으로 들어갑니다.
facebook_com_20140103_220703.jpg
facebook_com_20140103_220703.jpg
facebook_com_20140103_220703.jpg

계정설정 페이지에 들어오신후 이메일 부분을 클릭하시면 페이스북 이메일이라는 부분이 있습니다.
이부분에서 @facebook.com 이라는 부분을 제외한 앞부분이 여러분의 페이스북 페이지 아이디입니다.
실제 저아이디는 http://https://www.facebook.com/페이스북페이지아이
로들어가시면 페이지아이디의 페이스북 페이지로 이동됩니다.
https://gist.github.com/holic940817/a3465709d8b8c4e160ea/raw/1286db10c2e2255f6104c864de89aec8fa0af0b8/facebookList.jsp
위 링크는 페이스북 페이지를 긁어오는 소스 입니다.
첫글과 마찬가지로 주석을 달아놓았습니다.
https://www.facebook.com/holic940817
제가 지금까지 테스트로 작성한 게시글입니다.
또 이미지가 안올라가네요....
aaaaaaaaaaaaaaaaaaaa.png
aaaaaaaaaaaaaaaaaas.png
aaaaaaaaaaaaaaaaaaaa.png
aaaaaaaaaaaaaaaaaaaa.png
aaaaaaaaaaaaaaaaaas.png
minData와 maxData를 1로잡은 후 컴파일한 페이지입니다.
aasdasd.png
aasdasd.png
minData : 0
maxData : 2
asdasdasdasdasdasdas.png
xml페이지를 파싱하지 않은채 뿌린 페이지 입니다.
제가 주로 작업하는 홈페이지가 관공서, 비영리기관이라 홈페이지에 적용되는 원본소스를 공개하지 못하는점 이해바랍니다.
컴게에 올렸던 글인데 프로그래머 게시판이 생겨서 여기로 가져왔습니다 ㅎㅎ
약 2~3주간 야근해가며 맨땅에 헤딩으로 개발한 소스입니다. 유용하게 쓰셨으면 좋겠네요 ㅎㅎ
http://www.cckorea.org/images/ccl/lic_by_nc_nd_g.gif
꼬릿말 보기
전체 추천리스트 보기
새로운 댓글이 없습니다.
새로운 댓글 확인하기
◀뒤로가기
PC버전
맨위로▲
공지 운영 자료창고 청소년보호