brunch

You can make anything
by writing

C.S.Lewis

by 세컨드스페이스 Mar 20. 2019

SNS 로그인 개발 알쓸신잡

세컨드스페이스 디테일 연구소

이번에는 각종 SNS 로그인을 개발 할 때 유의해야 할 점을 이야기해보려 합니다.


현재 많은 사이트에서 로그인, 공유하기, 업로드 등의 기능이 사용되고 있습니다.

(물론 더 많은 걸 사용할 수 있지만..)



한 5년 전만 해도 SNS API를 붙이는 게 그렇게 복잡하지 않았습니다.

물론 그 당시에는 자료도 많지 않아서 맨땅에 헤딩인 경우가 많았지만요.

저도 SNS API 덕분에 쏠쏠한 수입을 올릴 수 있었죠.. (훗)


그런데 시간이 지나고 버전이 올라가고 써드파티 앱에서 개인정보나 보안등에 이유로 인하여 절차가 복잡해지고 있는 실정입니다.

(변경된 줄 모르고 저렴한 가격에 일을 받았다가 낭패 본 적이.. 크흠)


그래서 오늘은 국내에서 많이 쓰이는 SNS 로그인의 몇 가지 팁을 공유해보려고 합니다.

디테일 연구소의 취지에 맞게 알아두면 쓸모 있는 신박하지 않은 잡지식입니다.  




0. 공통사항


A. 클라이언트에게 미리 SNS 계정들을 받아두세요.

계정내놔.jpg


아주아주 당연한 말입니다. 보통 미리 요청해두는 정보입니다.

센스 있는 클라이언트 느님께서는 요청하지 않아도 전달해주십시다.


메일함에 "~~~~ 서비스 sns 계정입니다."라는 메일이 들어왔다고 해서 끝이 아닙니다.


최근에는 보안 이슈 강화로 인하여 위치, 브라우저, IP, 컴퓨터 등등의 변화나 오랜 기간 로그인이 되어있지 않은 계정의 경우 스마트폰이나 메일 인증을 요구합니다.


보통 SNS 실 계정 연동을 프로젝트 막바지에 진행합니다.

그전에는 내부 개발 계정으로 진행하는 경우대부분이지요.

프로젝트 막바지에 클라이언트에


 "여러 가지 SNS 로그인을 하려면 많은 인증이 필요하니 스마트폰 앞에서 대기를 타다가 날아오는 인증코드를 저에게 알려주십시오"


라는 요구를 당당하게 하실 수 있다면 이 충고는 무시하셔도 됩니다.


계정을 전달받으면 로그인해보고 개발 기간이 길다면 중간중간 로그인을 하여 휴면 상태에 빠지지 않게 해 두세요. 키값과 secret 코드를 미리 정리해두는 것도 좋은 습관!



B. 로그인 시 정보는 최소한으로 요청하

가끔 SNS에서 제공하는 개인정보를 모두 얻어내고 싶으신 클라이언트님들이 계십니다.

저희는 그럴 때


"너무 많은 개인정보 요청은 오히려 가입 유도를 방해한다"


라고 말씀드리곤 합니다.

SNS로부터의 개인정보 유출은 남일이 아닙니다.


사용자들도 서비스를 사용할 때 필요하지 않은 정보까지 요청하면 신뢰도만 하락하게 됩니다.


꼭 클라이언트 분들께 이야기를 해주십시오!!


 

귀찮..

(많으면 디비에 쌓기도 귀찮고 이걸로 또 뭐라도 하려고 하고!!! 기간은 늘어만 가고!!)



    

1. 페이스북 (Facebook)



국내 SNS는 아니지만 국내외를 가리지 않고 거의 필수라고 할 정도로 많은 곳에서 사용하고 있습니다.

AI, VR 등 많은 부분의 API가 있지만 우리는 당연히 로그인에만 초점을 맞춰보도록 하겠습니다.

과거에는 퍼미션만 대충 정리해서 API를 쏘면 정보를 보내줬고, 테스트도 쉽게 진행됐지요.

SNS 로그인의 시초답게 과거에 비해 많은 것이 바뀌었습니다.


그중에 몇 가지 추가된 부분만 적어보겠습니다.



A. 공개되지 않은 앱은 일반 유저로 테스트가 불가능합니다.

아직 개발 중인 앱은 일반 유저 계정으로는 테스트가 불가능합니다.


앱 설정에서 테스트 유저를 생성해서 제공해주어야 합니다.

미리미리 제공해드려서 "왜 로그인이 안 되는 것이냐아아아아!!" 하는 불호령을 듣지 않길 바랍니다.


계정 생성은 딱히 어려울 것은 없습니다.

다만 비밀번호는 초기화해서 전달드리는 게 좋습니다. 언제나 불호령은 무서운 것입니다.


자세한 정보는 아래 링크를 참고하세요.

https://developers.facebook.com/docs/apps/test-users/




B. 검수가 필요한 권한이 있습니다.

기본 권한은 따로 페이스북 검수를 진행하지 않습니다.


기본 권한이 아닌 추가 권한에 대해서는 페이스북 내에서 앱 검수를 진행합니다.


검수가 필요하지 않은 권한       

소셜 플러그인

웹 공유 대화 상자, iOS 또는 Android 공유 시트 등 Facebook을 통해 제공되는 공유 제품

이메일 주소, 이름, 프로필 사진만 액세스 되는 Facebook 로그인

  



이 외에는 검수가 필요한 권한이 있으니 아래 링크에서 확인을 하고 검수 기간을 고려하도록 하세요.

https://developers.facebook.com/docs/apps/review





2. 네이버 (NAVER)





네이버는 생각보다 굉장히 친절하게 되어있습니다.

사이트에 어떤 구조로 로그인을 넣을 것인지, 어떤 정보를 요청할 것인지 등에 따라 가이드를 제시하고 있습니다.

그런데 조금 길어요. 귀찮습니다. 다 읽어보기 귀차낭...


https://developers.naver.com/docs/login/devguide/


네이버는 유의 사항이랄 건 없습니다.

간단하게 알고 있으면 쓸모 있는 것만 공유해보겠습니다.



A. 관리자 ID와 테스터 ID를 따로 등록할 수 있다.

관리자 ID는 3개, 테스터 ID는 20개까지 등록할 수 있습니다.


네이버도 페이스북과 마찬가지로 '개발 중'인 앱의 경우 테스터 ID를 따로 지정해야 합니다.

페이스북과 다른 점은 기존 유저 ID를 등록한다는 점입니다.



B. 로그인 통계를 따로 볼 수 있다.

어차피 통계 API들을 따로 쓰시겠지만 네이버만 구우~~~~~~~~~~ㄷ이 보고 싶으시다면

'내 애플리케이션 -> 로그인 통계'에서 확인하실 수 있습니다.


새 로그인 / 해제   

환경별 새 로그인     

활동 사용자

누적 사용자    

성별/연령별 사용자


등의 정보를 확인할 수 있습니다.




3. 카카오 (Kakao)





초록 친구(헤이 브로 해가 지고 있어)와 왠지 가까워 보이는 노랑 친구입니다.

(혼혈의 느낌인 건가..)


여하튼 카카오는 개발 문서부터 조금 특이합니다.


다른 SNS는 기능별-> 플랫폼별로 설명이 되어있다면 카카오는 플랫폼-> 기능별로 설명이 되어있네요.

특정 API에 대한 전체적인 내용을 보고 싶었는데 플랫폼별로 봐야 하니 살짝 당황했습니다.


제가 미리 알려드렸으니까 여러분은 당황하지 마세요. :)

이 친구는 따로 설명할 부분이 없습니다.

너무 간단합니다.


검수, 개발상태 등과 관련된 부분도 없습니다.

앱 등록하고 APP KEY 받고 가이드에서 주는 소스를 그대로 넣고 클릭하면 끝입니다.

너무 간단해서 제가 잘못 알고 있는 건가 싶은 정도입니다.

 

혹시 제가 잘못 알고 쓰는 것이라면 댓글에 혼쭐을 내주세요..




4. 인스타그램 (Instagram)





인스타그램은 사진 때문인지 꽤나 까다로운 조건들이 있습니다. 

인스타그램의 개발자 페이지에 들어가면 대놓고 적혀있는 내용입니다만, 막상 미팅 때는 생각나지 않는 부분일 수 있습니다.


Instagram 그래프 API를 사용하려면 모든 앱이 앱 검수 절차의 일부이며 이제 모든 Instagram 그래프 API 엔드포인트에 필요한 비즈니스 인증을 받아야 합니다.2018년 5월 1일 이전에 검수된 앱은 2018년 8월 1일까지 다시 검수되어야 하며, 그렇지 않으면 API에 액세스 할 수 없습니다.


말 그대로 인스타그램 API는 필수적으로 검수가 진행됩니다.

가능하다면 앱 검수에 대한 부분을 인지하고 계시거나, 그렇지 않다면 클라이언트님께 검수 내용을 읽어보시고 유도하는 게 좋습니다.


검수 리젝은 끔찍한 결과로 이어지기 때문이죠!


또한 Facebook 페이지, 해당 페이지에서 할당된 역할, 인스타그램 계정 등의 필수조건이 있습니다.

아무래도 페이스북 소유기 때문에 비슷한 절차로 진행됩니다.


인스타는 꽤나 까다롭기 때문에 아래 링크를 잘 읽어보시는 것을 추천드립니다.


https://developers.facebook.com/docs/instagram-api/getting-started?locale=ko_KR



5. 구글 (Google)




우리의 전지전능한 큰 형님 갓 글입니다. 편향적 선호도가 있는 것은 아닙니다.

그저 개발자들에게는 갓이니까요!


구글은 사실 국내에서는 많이 쓰지 않는 것 같습니다. 많은 업체의 SNS 로그인을 만들어도 구글이 있는 경우는 보통 없네요. (사내에서는 무조건 구글! 구글 로그인!)


그럼에도 적어놓은 것은 빼놓기는 죄송하고, 알고 있다면 좋기 때문이지요.


구글 LOGIN API를 검색하면 Google Identity Platform | Google Developers 이 나옵니다.


이 녀석에게 들어가면 굉장히 많은 로그인 방법이 있습니다.

우리는 웹과 앱을 개발하기 때문에 그리고 흔히 쓰이는 기능들만 쓸 거니까 2개의 항목을 보면 됩니다.

(Plain Oauth 2.0은 다루지 않겠습니다.)


Google Sign-In

Firebase Authentication

Plain OAuth 2.0


Google Sign-In 은 기본적으로 로그인에만 초점이 맞춰져 있습니다.

로그인 기능만을 개발하신다면 이 부분을 참고하면 됩니다.

다만 Firebase를 이용해서 구글의 다양한 서비스를 사용하는 것은 자체 서비스를 준비하는 데에 큰 도움이 됩니다.


Firebase에 관한 부분은

'소규모 스타트업이 Firebase를 써야 하는 이유' 포스팅에서 다루고 있습니다.

 

https://brunch.co.kr/@second-space/5



필수적이지 않지만 알아두면 쓸모 있고 신박하지도 않은 잡지식을 공유해보았습니다.


서비스에 따라 내용의 경중은 다르지만 SNS 로그인 혹은 API를 사용하시는 클라이언트, 기획자, 개발자 등이 알아두면 좋을 정보들입니다.


SNS API는 버전 혹은 SNS 서비스사에 따라 계속해서 변경됩니다.


가능하다면 6개월에 한 번씩 변경된 내용이 없는지 확인하고 새로운 프로젝트를 준비하면 좋겠지요 :)




오픈 슬랙 채널에서 소통해요!

잡담 / 개발 문화 / 일하는 방식 / 정보 공유 / 채용 문의 / 프로젝트 문의 등 어떠한 소통도 환영합니다 :)


오픈 슬랙 채널에 참여하기⬇️

https://join.slack.com/t/secondspace-open/shared_invite/zt-19q85dgid-6TCjbezQs4TTafBwT4BxAQ





written by. 세컨드스페이스

https://secondspace.kr


브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari