페이스북 개발자 사이트에서 개발자 등록 후 발급 받을 수 있습니다.
자세히 알아보기
페이스북 로그인 기능 신규로 사용하는 경우
- 페이스북의 정책이 변경되어 http 형태의 사이트는 신규 연동이 불가합니다.
- https 접속이 가능하도록 하려면 '쇼핑몰 보안연결 설정(SSL)' 적용이 필요합니다.
- 카페24 쇼핑몰은 http 접속 시 https 로의 리다이렉트를 지원하지 않으므로 https 리다이렉트를 적용하려면 별도의 자바스크립트 수정이 필요합니다.
단, URL이 달라 별도의 사이트로 간주하기 때문에 포털사이트, 배너 등의 링크가 기존 http 주소로 연결되어있는 경우 https 리다이렉트 적용 시 영향을 미치게 됩니다.
(신규 쇼핑몰 또한 차후 광고 진행 시 문제가 발생할 가능성이 있습니다.)
앱 ID만 입력하여 페이스북 로그인 기능을 사용하고 있을 경우
신규 앱을 발급 받지 않고 기존 앱에서 '시크릿 코드' 를 확인하신 후 입력하면 됩니다.
신규 앱을 발급 받을 경우 기존 페이스북 가입 회원이 로그인이 되지 않는 문제가 발생합니다.
페이스북 개발자 등록 방법
- 페이스북 개발자 사이트로 이동하여 기존 페이스북 계정으로 로그인 또는 새 계정을 만듭니다.
- 로그인 후, '내 앱 버튼 클릭 > 앱 만들기 > 앱 유형 선택: 소비자'를 선택하여 신규 앱을 생성합니다.
Info
페이스북 로그인 연동 방법
- 생성한 앱의 '설정 > 기본설정'으로 이동하여, 필요 정보를 입력합니다.
- 앱 도메인' 항목 : 페이스북 로그인을 사용하려는 쇼핑몰 도메인을 입력합니다. 모바일에서도 사용하려면, 모바일 쇼핑몰 도메인도 입력합니다.
- '개인정보처리방침 URL' 항목 : 개인정보처리방침 내용이 들어가 있는 쇼핑몰 페이지 주소를 입력합니다.
- '서비스 약관 URL' 항목 : 서비스 약관 내용이 들어가 있는 쇼핑몰 페이지 주소를 입력합니다.
- '사용자 데이터 삭제' 항목 : '데이터 삭제 안내 URL'로 선택 후, SNS 회원 탈퇴 방법이 기재된 쇼핑몰 페이지 주소를 입력합니다.
- '카테고리' 항목 : 쇼핑을 선택합니다
- '앱 아이콘' 항목 : 앱 아이콘은 해당 쇼핑몰을 이용하는 고객이 로그인 시 보여지는 아이콘입니다.
512x512 ~ 1024x1024 픽셀의 JPG, GIF 또는 PNG 파일을 업로드 할 수 있습니다.
5MB 이하 업로드 가능합니다.
- 좌측 메뉴에서 '제품 추가'화면으로 이동하여, Facebook 로그인의 '설정' 버튼을 클릭합니다.
- 이후 빠른 시작을 이용하여 앱의 로그인을 구현하라는 글과 함께 안드로이드. IOS 등의 이미지가 작성된 화면이 나온다면, 더 이상 설정을 진행하지 않고, 좌측의 'Facebook 로그인 > 설정' 화면으로 이동합니다.
- '클라이언트 OAuth 설정' 중, '유효한 OAuth 리디렉션 URI(Valid OAuth Redirect URIs)' 항목에 아래와 같이 입력 후 저장합니다. (http 형태의 주소는 입력이 불가합니다.)
- https://{도메인}/Api/Member/Oauth2ClientCallback/facebook/
- https://www.{도메인}/Api/Member/Oauth2ClientCallback/facebook/
- https://m.{도메인}/Api/Member/Oauth2ClientCallback/facebook/
- 저장 후 화면 상단의 토글 버튼을 클릭하여 '개발 중'상태를 '라이브'로 변경 후 팝업창에서 모드 전환을 선택합니다.
- '대시보드'로 이동하여 '앱 시크릿코드' 항목의 '보기' 버튼을 클릭하시면 코드를 확인할 수 있습니다.
- 강화된 페이스북의 앱 검수 과정으로 인해, 라이브된 앱이 개발중으로 변경되거나, 앱 사용이 중단되는 이슈가 발생할 수 있습니다.
앱 이용이 중단되거나 개발중으로 변경된 경우 '알림 > 받은 메시지함'에서 사유를 확인할 수 있습니다.
쇼핑몰 관리자 설정 방법
- 으로 이동합니다.
- '페이스북 로그인' 항목을 '사용함'으로 설정하고 개발자센터에서 확인한 App ID와 App Secret Code를 입력하고 '저장' 버튼을 클릭합니다.
디자인 수정 방법
해당 기능을 사용하기 위해서는 디자인 수정이 필요합니다.
디자인 수정 방법은 아래 내용을 참고해주세요.
으로 이동합니다.