본문 바로가기

지적자본/워드프레스

워드프레스 WP-Social Login 페이스북 로그인 연결한 후기

by 디런치 2020. 8. 9.

필자는 꽤 오래전부터 워드프레스 플러그인 WP-Social Login을 사용하여 운영중인 웹사이트에 소셜로그인이 가능하도록 하고 있다. 불과 몇년전만 하더라도 다양한 소셜플렛폼들은 자신들의 이용자들이 더 편리하게 다른 플렛폼을 이용할 수 있도록 자신들의 회원정보로 특정 플렛폼이나 웹사이트들을 이용할 수 있는 서비스를 하였다.

 

하지만, 최근 2-3년 사이 각국에서는 개인정보보호법들을 마련하기 시작했으며, 온라인상에서의 개인정보가 굉장히 중요하게 여겨지기 시작했다. 따라서 소셜미디어 본사들은 자신들의 유저들의 개인정보를 이용해 로그인할 수 있는 서비스에 대해 개인정보를 보호할 필요를 느끼고 보안이 명확한 플렛폼이나 웹사이트에만 제한적으로 로그인 서비스를 이용할 수 있도록 제한하기 시작했다.

 

가장 먼저 시작한 것이 페이스북이다. 예전에는 보안인증서가 없는 홈페이지(http)에서 로그인 서비스를 제공했던 페이스북이 이제는 보안인증서가 있는 홈페이지(https)만 로그인 서비스를 제공한 것이다.

 

 

 

 

보안인증서 귀찮은데 페이스북 로그인쯤이야..

 

제목과 같이 필자는 개인정보보호법에 대해 민감하게 반응하지 않았다. 물론 반성하고 최근에 보안인증서를 설치하였다. 내 개인의 정보만큼, 내 사이트의 편리성 만큼 이용자들의 개인정보도 중요하니 보안인증을 하여 사이트를 보호하기 시작했다.

 

하지만, 이러한 공감대를 얻기까지 필자 역시도 많은 고민을 하였다. 보안인증을 통해 이용자들에게 제한을 주거나 강제적으로 내 사이트에 다른 서비스를 설치하는 것을 부당하다고 생각했기 때문이다. 물론 지금은 아니다. 여하튼 그래서 페이스북 로그인은 사용하지 않고 보안인증서가 없이도 로그인이 가능한 다른 서비스만 제공하였다.

 

하지만, 이제는 보안인증서를 설치하였으니 페이스북 로그인도 제공안할 이유가 사라졌다.

 

 

 

WP-Social Login 페이스북 설정

 

그런데 위의 플러그인으로 페이스북을 설정해도 아래와 같은 메시지로 무엇인가 문제가 있음을 알렸다.

 

"

Invalid Scopes: user_friends. This message is only shown to developers. Users of your app will ignore these permissions if present. Please read the documentation for valid permissions at: https://developers.facebook.com/docs/facebook-login/permissions"

 

 

 

 

간단히 구글링을 해 보니 몇가지 해결책이 나왔다. 로그인 서비스에 이용할 페이스북의 개인정보의 권한을 얻어야 한다고 하는데, 필자는 페이스북 이용자의 "이메일"만이 필요하기 때문에 이미 권한은 얻어 놓은 상태였다.

 

또한 위 어플의 "도메인/Web/web/wp-content/plugins/wordpress-social-login/wp-social-login.php"에 아래 문구를 추가하라는 솔루션도 보았다.

 

function wsl_change_default_permissons( $provider_scope, $provider )
{
if( 'facebook' == strtolower( $provider ) )
{
$provider_scope = 'email, public_profile';
}

return $provider_scope;
}

add_filter( 'wsl_hook_alter_provider_scope', 'wsl_change_default_permissons', 10, 2 ); 

 

위의 코드를 추가하였으나 여전히 에러메시지를 떴다.

 

 

 

 

문제 해결 : 꼼꼼하지 못한 성격

 

해결은 간단했다. 다른 플렛폼과 다르게 페이스북의 경우는 Valid OAuth redirect URIs 의 항목이 두종류이다.

 

 

 

자세히 보면 동일한 것 같은 두개의 경로는 끝쪽 "?hauth.done"과 "?hauth_done"로 다르다. 

 

위의 처럼 유요한 OAuth에 두 주소 모두를 입력해야 정상적으로 작동한다.

 

 

 

결론

 

너무 당연한 이야기이지만, 두개의 경로가 같을 거라는 꼼꼼하지 못한 성격이 나은 고생이었다.

앞으로 좀 더 꼼꼼히 확인해보자

반응형


댓글