[Spring] facebook Login 간편구현

5/3 개발일기

이거 하는데 진짜 헤맸다. spring social API 버전에 따라 로직이 천차만별이었다.

받아보는 예제마다 구현하는 방식이 너무나 다르고, 내쪽에서는 안되고...

하다하다 결과적으로 구현해낸 페이스북 로그인은 김샐 만큼 너무나 간단했다. 

아래 spring.io 홈페이지의 예제를 그대로 따라하면 된다.

Accessing Facebook Data

나는 여기에서 조금만 더 변형했다. 저 예제를 따라하면, 사이트 최초 구동시 페이스북 로그인을 해야만 하는데, 나는 index 페이지는 누구든 접속할 수 있도록 열어놓고 로그인 화면에서 [페이스북 로그인] 버튼을 눌렀을 때 소셜로그인 기능을 작동하게 하고 싶었다. 

그래서,

HelloController.java

@Controller
public class HelloController {    
    private Facebook facebook;
    private ConnectionRepository connectionRepository;

   @Inject
    public HelloController(Facebook facebook, ConnectionRepository connectionRepository) {
        this.facebook = facebook;
        this.connectionRepository = connectionRepository;
    }

   @RequestMapping(value="/")
   public String home(Model model){
       if (connectionRepository.findPrimaryConnection(Facebook.class) != null) {
            model.addAttribute("facebookProfile",
                                                   facebook.userOperations().getUserProfile());
       }       
        return "index";
    }

    @RequestMapping(value="/login")
    public String Login(Model model){       
        return "login";
    }
}

 

login.jsp

<script>
$(document).ready(function(){
        $(".btn-facebook").click(function(){
            $("#LoginFrm").attr('action','/connect/facebook'); 
            $("#LoginFrm").submit();
    });
});
</script>

<form id="LoginFrm" method="post">
    <a class="btn btn-block btn-social btn-facebook">
        <span class="fa fa-facebook"></span>Facebook 계정으로 로그인하기
    </a>
</form>

또한 위 링크의 예제는 thymeleaf 를 사용하여 /template/ 하위에 facebookConnect.html, facebookConnected.html 을 만들어주었는데 나는 application.properties 에서 view 위치를 아래와 같이 설정해주었으므로, /WEB-INF/jsp/ 밑에 /connect/ 폴더를 만들어 facebookConnect.jsp, facebookConnected.jsp 를 생성해주었다.

application.properties

#SPRING MVC SETTINGS
spring.mvc.view.prefix=/WEB-INF/jsp/
spring.mvc.view.suffix=.jsp

#Facebook
spring.social.facebook.app-id={facebook-app-id}
spring.social.facebook.app-secret={facebook-secret-key}

이렇게 세개만 세팅해주면 모든 것이 끝난다. 다른 건 아무것도 필요 없다. 소스를 보면 알겠지만 Controller에서 /connect/facebook 이라는 url 에 맵핑된 부분은 없다.  맵핑시키지 않았는데 어떻게 찾아가는 지 궁금했는데, 링크 글을 읽어보면  connectController를 내장 지원한다는 것 같다.(spring boot에서? spring social에서?)

링크드인과 트위터까지는 이렇게 지원이 된다고 하니, 참 편하지만.. 나는 Google과 Naver를 연동해야 한다.ㅠㅠ 이 두개는 저렇게 연결이 안되서 connection 을 직접 구현해주어야 한다. 이건 아직도 삽질 중이니 나중에.. 언젠간 ㅜㅜ

---

환경정보 : spring-boot-starter 1.3.3.RELEASE