디자인솔이 최근 PHP V5.6에서 PHP V7.0버전대로 서버 이전을 했습니다. 동시에 SSL인증도 달았지요. 크롬 주소창에 초록 자물쇠 보이지요? ㅎㅎ
Let's Encrypt 무료인증서로 3개월마다 자동 갱신됩니다.
http에서 https로 바뀌면서 그동안 미뤄왔던 구글 로그인을 설정했습니다. 분량은 많으나 간단하니 따라해보세요.
소셜XE(SNS 로그인)를 사용하려면
1. 모듈 (CONORY님, 무료 다운로드)
https://xetown.com/rxe_point/2930
2. 통합로그인 스킨 (다이오니님, 30P)
https://xetown.com/rxe_point/372070
이 필요합니다. 다운 받으신후 FTP 업로드후 관리자화면에서 새로고침후 대시보드에 나오는 db생성, db테이블 생성 버튼을 클릭하면 설치 완료.
1. 우선 Google Plus 사용자만 구글 로그인이 가능하답니다. Google Plus 가입하시구요.
디자인솔 사이트의 관리자 이메일은 네이버예요. 그래서 구글로 로그인 하면 관리자가 아닌 일반 회원으로 로그인이 됩니다.
2. 디자인솔 레이아웃에서 소셜 XE를 사용하려면 레이아웃 일반설정에서 로그인 위젯을 OFF하세요. 복사한 레이아웃 모두 OFF로 변경합니다.
OFF하면 XE 기본 로그인 혹은 소셜 XE 로그인이 됩니다.
3. 고급/ 설치된 모듈/ 소셜XE/ API 설정탭/ Google API에서 Redirect URL을 구글에게 주고 Client ID, Client Secret을 받게됩니다.
4. https://console.developers.google.com/
구글 개발자 콘솔로 이동하여 프로젝트를 만듭니다. 프로젝트 이름 입력. 만들기
5. 프로젝트 이름 좌측에 Google APIs를 클릭하면 대시보드, 라이브러리, 사용자 인증 정보가 있어요.
6. 라이브러리(소셜)를 사용하기전 인증을 해야해서 사용자 인증 정보/사용자 인증 정보 만들기 클릭
7. API 키를 클릭하면
8. API 키가 생성됩니다. 구글 API를 이용하기위한 대표키입니다.
9. OAuth 동의 화면으로 이동하여
10. 이메일 주소, 사용자에게 표시되는 제품이름, 홈페이지 URL(선택사항), 제품 로고 URL(선택사항)을 입력후 저장합니다.
네아로(네이버 아이디 로그인) 등록시 제출한 섬네일이 네이버 서버에 저장되는것과는 달리 구글은 내 서버에 업로드후 경로를 지정하는군요.
11. 도메인 확인 탭으로 이동하여 도메인 입력후 도메인 추가 클릭
12. 사용자 인증 정보 입력을 마쳤습니다. 이제 라이브러리로 이동.
13. 많은 라이브러리중 Google+ API 를 찾으세요.
14. 사용 설정
15. 프로젝트에 사용자 인증 정보 추가에서 클라이언트 ID 클릭
(클라이언트 ID 글자가 작아 못보고 아래로 내려가다 저는 길을 잃고 마는..)
16. 애플리케이션 유형을 웹애플리케이션으로,
이름 입력,
도메인 입력(도메인끝에 /붙이면 붉은색글자로 에러표시나요),
소셜XE의 Redirect URL을 복사하여 붙여넣기한후 생성.
17. 클라이언트 ID, 비밀번호가 생성됩니다. 복사하여 소셜XE에 붙여넣기합니다.
18. 소셜XE 환경설정 탭으로 이동하여 그림처럼 설정후 저장. 최소한의 정보만 받기위한 설정입니다.
19. 로그아웃후 구글 로그인합니다.
20. 구글이 로그아웃 상태라 자신의 아이디 클릭, 허용, 다음 순으로 클릭
21. 로그인후 닉네임을 클릭하면 회원정보 페이지로 이동됩니다. 어떤 정보를 받는지 확인해보아요.
이메일주소, 닉네임, 프로필 사진(프로필이 있다면)이 다네요. ^^ 부담없는 로그인이죠?
22. SNS 관리탭으로 이동하면 해당 회원의 등록된 SNS 계정을 확인할수 있습니다.
최근 구글, 구글유튜브 검색이 급증한다고 해요. 급증하는 구글 이용자를 위해 소셜 로그인은 이제 선택이 아닌 필수가 된것같습니다.
XE에서 소셜 로그인(SNS 로그인) 구글편을 살펴보았습니다.
디자인솔 레이아웃과 XE SNS 소셜 로그인_네이버
디자인솔 레이아웃과 XE SNS 소셜 로그인_페이스북
