<div style="text-align: left"><img width="800" height="662" class="chimg_photo" id="image_0024999929845916424" style="border: currentColor" alt="1.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388750775CYQjKJKU.png" /></div> <div style="text-align: left"> </div> <div style="text-align: left">일반적인 페이스북 초기페이지입니다.</div> <div style="text-align: left">개발용으로 계정을 하나 더 만들었습니다.</div> <div style="text-align: left"> </div> <div style="text-align: left"> </div> <div style="text-align: left"> <div style="text-align: left"> <div style="text-align: left"><img width="800" height="725" class="chimg_photo" id="image_09358209896138259" style="border: currentColor" alt="3.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388750841SHbp2I7UI.png" /></div> <div style="text-align: left"> </div> <div style="text-align: left">계정생성이 끝나셨으면 <a target="_blank" href="https://developers.facebook.com/" target="_blank">https://developers.facebook.com/</a> 으로 들어가시면 상단과 같은 페이지가 나옵니다.</div> <div style="text-align: left">상단의 녹색 가입하기 버튼을 눌러주세요</div> <div style="text-align: left"> </div> <div style="text-align: left"> <div style="text-align: left"><img width="800" height="725" class="chimg_photo" id="image_06776298088730146" style="border: currentColor" alt="4.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388750924oRruId2WD2kcRZVg4t6dzVzpG8x6ueO4.png" /></div></div></div></div> <div><br />가입하기 버튼을 누르시면 위와같은 레이어팝업이 나타납니다. 페이스북의 개인정보 취급방침에 동의하냐고 묻지만...</div> <div>귀찮아서 읽지않고 체크후 계속하기를 눌러줍니다(다들그렇지않나요?...나만그런가)</div> <div> </div> <div style="text-align: left"><img width="800" height="725" class="chimg_photo" id="image_06493968155364465" style="border: currentColor" alt="5.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388750983zW2ZUFGbmaLR.png" /></div> <div> </div> <div>계속하기 버튼을 누르시면 레이어팝업이 위와같이 변합니다</div> <div>생성할 앱의 속성을 고르라고 합니다.</div> <div>모두 체크 해제하시고 계속하기를 눌러주시면 됩니다.</div> <div> </div> <div style="text-align: left"><img width="0" height="0" style="border: currentColor" alt="7.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388751050PsUxm2ag6yrZYgcTmq4n.png" /></div> <div style="text-align: left"><img width="800" height="725" class="chimg_photo" id="image_06677967730946691" style="border: currentColor" alt="6.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388751065lviuOVPMqjlSa.png" /></div> <div><br />이렇게 developers 가입이 끝났습니다.</div> <div>페이스북에 가입후 휴대폰 인증을 하지 않으신 분은 developers 가입중 휴대폰인증이 필요하실겁니다.</div> <div> </div> <div style="text-align: left"> <div style="text-align: left"><img width="800" height="792" class="chimg_photo" id="image_05021599340203977" style="border: currentColor" alt="4444.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388751232POiKJQBj6LfY7Tp6H4KJIDpL7jhGYJ.png" /></div> <div style="text-align: left"> </div> <div style="text-align: left">가입이 끝나셨으면 <a target="_blank" href="https://developers.facebook.com/apps" target="_blank">https://developers.facebook.com/apps</a> 로 들어가 주세요</div> <div style="text-align: left">들어가시면 상단에 새앱만들기라는 파란색 버튼을 클릭해주시면 됩니다.</div> <div style="text-align: left"> </div> <div style="text-align: left"> <div style="text-align: left"><img width="800" height="725" class="chimg_photo" id="image_031329020739334173" style="border: currentColor" alt="7.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388751365FQ5JMFQAr.png" /></div></div></div> <div> </div> <div> </div> <div>ㅂ버튼을 누르시면 상단과 같은 레이어 팝업이 나타납니다.</div> <div>앱이름(영문자 + 숫자 조합 가능)</div> <div>앱 네임 스페이스(소문자 7글자 이상)</div> <div>을 적어주시고 </div> <div>앱 카테고리는 기타를 선택 후 계속 하기를 눌러줍니다.</div> <div> </div> <div style="text-align: left"><img width="800" height="725" class="chimg_photo" id="image_0869786187275443" style="border: currentColor" alt="8.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388751451u7sqb4kAGuqw7FNXIz.png" /></div> <div> </div> <div>계속하기를 누르시면 상단과 같은 자동가입방지 입력문자가 나타납니다.</div> <div>가끔 알아보기힘들정도의 문자가 나타나는데 다른텍스트 시도하기버튼을 누르셔서 갱신하시면됩니다</div> <div>자동방지 입력문자를 입력하시고 계속하기를 눌러줍시다.</div> <div> </div> <div style="text-align: left"><img width="800" height="631" class="chimg_photo" id="image_022221820444451262" style="border: currentColor" alt="9.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388751585N5F4G3RlZIangiPgt724s1CfK.png" /></div> <div style="text-align: left"> </div> <div style="text-align: left"> <div>이제 앱 생성이 끝났습니다.</div></div> <div style="text-align: left">앱 생성이 완료되시면 앱 정보 페이지로 가게 되는데</div> <div style="text-align: left">다시들어가시려면 <a target="_blank" href="https://developers.facebook.com" target="_blank">https://developers.facebook.com</a> 페이지 상단에 apps를 눌러주시면 다시 정보페이지로 갈 수 있습니다.</div> <div> </div> <div> </div> <div style="text-align: left"> <div style="text-align: left"><img width="800" height="624" class="chimg_photo" id="image_08575466006708329" style="border: currentColor" alt="4444.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388751782kGjOGSXA57b5WlFpb1vtjmby.png" /></div> <div style="text-align: left"> </div> <div style="text-align: left">apps 버튼을 누르게 되면 상단과 같은 페이지가 나타나는데요</div> <div style="text-align: left">생성한 앱이 여러개일수록 왼쪽의 앱메뉴가 늘어납니다.</div> <div style="text-align: left">여기서 상단에 있는 회색메뉴 Edit app 버튼을 눌러줍시다.</div></div> <div style="text-align: left"> </div> <div style="text-align: left"> </div> <div style="text-align: left"> <div style="text-align: left"> <div style="text-align: left"> <div style="text-align: left"><img width="800" height="792" class="chimg_photo" id="image_024178331017501253" style="border: currentColor" alt="4444.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388751924bMi4Pq9wwXe9grq3asMxGmuwQlE.png" /></div></div></div></div> <div style="text-align: left"> </div> <div>앱 정보 페이지입니다.</div> <div>상단의 앱 아이디와</div> <div>앱 시크릿코드를 사용해야합니다.</div> <div>어디도망가지않으니 적어두지 않으셔도 됩니다.</div> <div>여기서 왼쪽에 Advenced 메뉴를 클립해주시면</div> <div> </div> <div><br /><img width="800" height="558" class="chimg_photo" id="image_040874379348719586" style="border: currentColor" alt="12.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388751868D6GUOLPnbz4VRxWJnKQULe.png" /></div> <div> </div> <div>위와같은 페이지가 나타납니다.</div> <div>스크롤을 아래로 내리시다보면</div> <div> </div> <div style="text-align: left"><img width="706" height="388" style="border: currentColor" alt="13.jpg" src="http://thimg.todayhumor.co.kr/upfile/201401/1388751980pRFjVBByhVom.jpg" /></div> <div> </div> <div>이런부분이 있습니다. Valid OAuth redirect URIS 부분은 이 앱의 정보가 사용될 수 있는 페이지를 지정해주는부분입니다.</div> <div>여러사이트를 지정 할 수 있습니다.</div> <div> </div> <div>이제 JSP 소스부분입니다.</div> <div><a target="_blank" href="https://gist.github.com/holic940817/9d20db1a17e53502aa84#file-get_token-jsp" target="_blank">https://gist.github.com/holic940817/9d20db1a17e53502aa84#file-get_token-jsp</a></div> <div> </div> <div>위링크로 가시면 제가 올려둔 소스를 보실 수 있습니다.</div> <div>이해하기 쉽게 주석을 달아놨습니다.</div> <div> </div> <div>이 소스를 이클립스로 컴파일 해보시면</div> <div>(이상하게 이페이지는 파일이 jpg, png 확장자로 안올라가네요... gif 로 인코딩해서 화질구집니다)</div> <div> </div> <div style="text-align: left"><img width="302" height="258" style="border: currentColor" alt="16.gif" src="http://thimg.todayhumor.co.kr/upfile/201401/1388752603WGMtxe254nGSaWVttALIk8ACVXPHsP.gif" /></div> <div style="text-align: left"> </div> <div style="text-align: left"> <div>get token이라는 버튼이 보이실겁니다.</div> <div>이버튼을 눌러주세요.</div> <div> </div> <div> </div> <div> </div> <div>(사진이 세 확장자 모두 안올라가는관계로....)</div> <div> </div> <div>이런 문구가 나타나실겁니다</div> <div> </div> <div>"생성한앱이름" 에서 다음 정보를 받습니다: 회원님의 공개 프로필, 친구 리스트 그리고 상태업데이트</div> <div>라는 문구와 함께 하단에 취소, 확인버튼이 있습니다.</div> <div>확인버튼을 눌러주시면</div> <div> </div></div> <div> </div> <div> </div> <div style="text-align: left"><img width="0" height="0" style="border: currentColor" alt="16.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388752164UlHww2zIzzhLd.png" /></div> <div style="text-align: left"><img width="302" height="258" style="border: currentColor" alt="15.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388752185jXHHwbYPD.png" /></div> <div><br />위와같은 코드가 나타납니다.</div> <div>제가 직접 홈페이지를 만들때는 토큰을 받는 모든페이지를 팝업으로 처리 후 부모창에 받아온 토큰값을 넘겨줍니다.</div> <div>이렇게 받아온 토큰값에는 유효기간이 있습니다.</div> <div>원래는 무제한 토큰이 있었는데 페이스북 개발자페이지가 개편되면서 토큰이 2개월짜리밖에 생성이 되지 않습니다.</div> <div>이런방식으로 토큰을 DB에 저장한 후 2개월마다 갱신을 해줍니다.</div> <div> </div> <div> </div> <div>일단 페이스북의 타임라인을 긁어오기전에</div> <div>페이스북 페이지의 아이디를 알아야합니다.</div> <div style="text-align: left"><img width="0" height="0" style="border: currentColor" alt="제목 없음.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388754573GMPQU3GZ5.png" /></div> <div style="text-align: left"><img width="800" height="343" class="chimg_photo" id="image_09234990820429434" style="border: currentColor" alt="제목 없음.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388754576cMRqnVPvhfCa.png" /></div> <div><br />페이스북 메인에서 상단 오른쪽의 톱니바퀴 모양을 클릭하신 후 계정설정으로 들어갑니다.</div> <div> </div> <div style="text-align: left"><img width="0" height="0" style="border: currentColor" alt="facebook_com_20140103_220703.jpg" src="http://thimg.todayhumor.co.kr/upfile/201401/1388754634NubdkWEWqP49z15IypMo28.jpg" /></div> <div style="text-align: left"><img width="0" height="0" style="border: currentColor" alt="facebook_com_20140103_220703.jpg" src="http://thimg.todayhumor.co.kr/upfile/201401/1388754637kDJk7CZvYitDTqDe8tR.jpg" /></div> <div style="text-align: left"><img width="800" height="615" id="image_0.5509896304912188" style="border: currentColor" alt="facebook_com_20140103_220703.jpg" src="http://thimg.todayhumor.co.kr/upfile/201401/1388754640Fgzs1diSL5QWPNoxEY.jpg" /></div> <div><br />계정설정 페이지에 들어오신후 이메일 부분을 클릭하시면 페이스북 이메일이라는 부분이 있습니다.</div> <div>이부분에서 @facebook.com 이라는 부분을 제외한 앞부분이 여러분의 페이스북 페이지 아이디입니다.</div> <div>실제 저아이디는 <a target="_blank" href="http://https://www.facebook.com/" target="_blank">http://https://www.facebook.com/페이스북페이지아이</a>디</div> <div>로들어가시면 페이지아이디의 페이스북 페이지로 이동됩니다.</div> <div> </div> <div><a target="_blank" href="https://gist.github.com/holic940817/a3465709d8b8c4e160ea/raw/1286db10c2e2255f6104c864de89aec8fa0af0b8/facebookList.jsp" target="_blank">https://gist.github.com/holic940817/a3465709d8b8c4e160ea/raw/1286db10c2e2255f6104c864de89aec8fa0af0b8/facebookList.jsp</a></div> <div> </div> <div>위 링크는 페이스북 페이지를 긁어오는 소스 입니다.</div> <div>첫글과 마찬가지로 주석을 달아놓았습니다.</div> <div> </div> <div> </div> <div><a target="_blank" href="https://www.facebook.com/holic940817" target="_blank">https://www.facebook.com/holic940817</a><br />제가 지금까지 테스트로 작성한 게시글입니다.</div> <div>또 이미지가 안올라가네요....</div> <div> </div> <div style="text-align: left"><img width="0" height="0" style="border: currentColor" alt="aaaaaaaaaaaaaaaaaaaa.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388756097b7TesBBmGtuWyYBvyNGDOumUYAvu.png" /></div> <div style="text-align: left"><img width="0" height="0" style="border: currentColor" alt="aaaaaaaaaaaaaaaaaas.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388756099aqL8X6LO4QHGnXpCmrivBqkzuE3i.png" /></div> <div style="text-align: left"><img width="0" height="0" style="border: currentColor" alt="aaaaaaaaaaaaaaaaaaaa.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388756100UkLfaPNV2UqIg1iM55n23qWnRA6HbF1.png" /></div> <div style="text-align: left"><img width="0" height="0" style="border: currentColor" alt="aaaaaaaaaaaaaaaaaaaa.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388756102BrpfbMXV.png" /></div> <div style="text-align: left"><img width="363" height="1050" style="border: currentColor" alt="aaaaaaaaaaaaaaaaaas.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388756102HeocMmND79.png" /></div> <div style="text-align: left"> </div> <div style="text-align: left">minData와 maxData를 1로잡은 후 컴파일한 페이지입니다.</div> <div style="text-align: left"> </div> <div style="text-align: left"> <div style="text-align: left"><img width="0" height="0" style="border: currentColor" alt="aasdasd.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388756295B6d8LnnGhx7QtcliplPc1UmOpI7l.png" /></div> <div style="text-align: left"><img width="776" height="1050" style="border: currentColor" alt="aasdasd.png" src="http://thimg.todayhumor.co.kr/upfile/201401/13887562971TTtjREiIva8xiHG8xr.png" /></div> <div style="text-align: left"> </div> <div style="text-align: left">minData : 0</div> <div style="text-align: left">maxData : 2</div></div> <div> </div> <div style="text-align: left"><img width="800" height="408" class="chimg_photo" id="image_031021171093483246" style="border: currentColor" alt="asdasdasdasdasdasdas.png" src="http://thimg.todayhumor.co.kr/upfile/201401/1388756598RD9ub5ULUj3Xfy8vuvwE.png" /></div> <div> </div> <div>xml페이지를 파싱하지 않은채 뿌린 페이지 입니다.</div> <div> </div> <div> </div> <div>제가 주로 작업하는 홈페이지가 관공서, 비영리기관이라 홈페이지에 적용되는 원본소스를 공개하지 못하는점 이해바랍니다.</div> <div>컴게에 올렸던 글인데 프로그래머 게시판이 생겨서 여기로 가져왔습니다 ㅎㅎ</div> <div>약 2~3주간 야근해가며 맨땅에 헤딩으로 개발한 소스입니다. 유용하게 쓰셨으면 좋겠네요 ㅎㅎ</div> <div> <div style="text-align: right"><img width="88" height="31" id="image_0.29417515588619114" style="border: currentColor" alt="http://www.cckorea.org/images/ccl/lic_by_nc_nd_g.gif" src="http://www.cckorea.org/images/ccl/lic_by_nc_nd_g.gif" /></div></div>