본문 바로가기
Django(웹서비스 만들기)

[7주차] 여러 서비스 연계하기

by SOHEE- 2022. 1. 8.

채널톡 달기

가입 및 설치

채널톡을 검색하여 회원가입을 합니다.

무료로 새 채널을 생성할 수 있고, 적절한 서비스 명과 홈페이지 주소(sohee.duckdns.org)를 입력합니다. 서비스 업종은 IT 서비스, 직원수는 가장 작은 1~4명을 선택했습니다.

자체 제작 웹사이트를 누른 후 나오는 코드를 <head>에 붙여넣습니다.

만약 초기에 코드를 복사하지 못했다면 설정 > 채팅 설치 및 설정 > 채널톡 버튼 설치 로 이동하여 스크립트를 확인하실 수 있습니다.

 

결과 확인

웹 페이지 하단에 채널톡 아이콘이 생기며, 문의 글을 남기면 아래와 같이 관리자 페이지에서 확인할 수 있습니다.

 

 

사용자 메시지를 Gmail로 보내기

Google 설정하기

gmail 계정 설정의 보안 페이지에서 보안 수준이 낮은 앱의 액세스를 사용하도록 허용합니다. 

 

settings.py에 메일 정보 추가하기

다른 정보는 그대로 입력하고 HOST_USER, HOST_PASSWORD 값만 수정하여 입력합니다.

 

views.py 내용 수정하기

웹에서 받은 정보 중 message 값을 settings.py에서 설정한 이메일로 보낼 수 있도록 설정합니다.

 

결과 확인

웹에서 Contact US의 필드를 채워 전송하면 아래와 같이 메일에서 메시지가 전달된 것을 볼 수 있습니다.

 

 

 

사용자 메시지를 Google Sheet로 보내기

Google Cloud에서 API 및 서비스 계정 설정하기

링크 [https://console.developers.google.com/]로 들어가거나 [https://console.cloud.google.com/]에서 `APIs & Services` 페이지로 이동합니다. 만약 구글 클라우드 프로젝트가 없는 경우 프로젝트 설정을 먼저 합니다. 

`Enable APIs and Services`를 누른 후 검색창에서 ‘sheet’를 검색하여 `Google Sheets API`를, ‘drive’를 검색하여 `Google Drive API`를 찾아 활성화 합니다.

다시 APIs & Services 페이지로 이동하여 사용자 인증 정보(Credentials)에서 서비스 계정을 생성합니다.

 

생성된 계정을 누르고 들어가서 KEYS 탭으로 이동합니다. JSON으로 된 새로운 키를 생성합니다.

 

적용 설정하기

앞서 설정한 JSON 키를 소스 프로젝트에 넣은 후 client_email 값을 복사합니다.

Google Drive에 구글 스프레드 시트를 하나 생성한 뒤, 복사했던 client_email을 편집자로 공유 설정하고, 파이참 콘솔에서 에서 google API를 사용하기 위해 패키지를 설치합니다.

pip install gspread
pip install --upgrade oauth2client

이메일로 보내는 코드 대신 아래 코드를 입력합니다.

# 구글 스프레드시트로 보내기
# google api 사용 범위 지정
scope = [
    'https://spreadsheets.google.com/feeds',
    'https://www.googleapis.com/auth/drive',
]

# 다운로드받은 json파일 지정
json_file_name = 'sshee-int-20200421-174b2e0da21f.json'

# 구글 인증
credentials = ServiceAccountCredentials.from_json_keyfile_name(json_file_name, scope)
gc = gspread.authorize(credentials)

# 스프레드시트 주소
spreadsheet_url = 'https://docs.google.com/spreadsheets/d/1V_CvUApVD6Q9qPTaObAT_QGAe1s87WYWTjfLrLnJtek/edit#gid=0'

# 스프레스시트 문서 가져오기
doc = gc.open_by_url(spreadsheet_url)

# 시트 선택하기
worksheet = doc.worksheet('시트1')

# 시트 맨 마지막줄에 추가
worksheet.append_row([name, email, phone, message])

 

테스트 해보면 사용자 메시지가 잘 들어오는 것을 볼 수 있습니다.

 

 

카카오 로그인 설정하기

카카오 개발자 등록

구글에 ‘카카오 개발자’를 검색하여 https://developers.kakao.com/ 를 방문합니다.

회원가입 및 로그인 후 첫 페이지에 보이는 시작하기를 누릅니다.

애플리케이션 추가하기 버튼을 눌러 내가 개발한 앱을 등록하는 과정을 거칩니다. 

플랫폼 정보가 비워져있으므로 플랫폼 설정하기 버튼을 눌러 Android/iOS/Web 중에 Web을 선택하여 아래와 같이 입력합니다. 

Redirect URI를 등록해야 하는데, 이는 로그인에 성공 시 로그인 페이지에서 아래 URI를 호출하여 토큰 값을 전달해줍니다. 

 

제품 중 카카오 로그인을 사용 설정하고, 동의항목에서 닉네임만 필수로 사용하도록 구성합니다. 

 

views.py에서 카카오 로그인 페이지 연결하기

애플리케이션 추가할 때 보이던 앱 키 중에 REST API 키를 복사하여 KakaoLogin 클래스 안에 app_rest_api_key의 값으로 넣어줍니다. redirect_uri는 카카오 개발자 페이지에서 지정한 리다이렉션 URI의 정보로 동일하게 입력합니다. 

class KakaoLogin(APIView):
    def get(self, request):
        app_rest_api_key = '3b60ea6ed77a28f4060286048c7c740b'
        redirect_uri = "http://127.0.0.1:8000/kakao/oauth"
        return redirect(
            f"https://kauth.kakao.com/oauth/authorize?client_id={app_rest_api_key}&redirect_uri={redirect_uri}&response_type=code"
        )

 

urls.py에서 KakaoLogin 경로 등록하기

 

접속 테스트 및 CallBack 로직 만들기

카카오 로그인을 시도하면 앞서 설정한 닉네임 제공에 대한 동의하기 창이 뜨고 그 뒤에 로그인 에러가 떨어집니다. 로그인이 되지 않는 이유는 로그인 성공 시 카카오에서 전달하는 토큰을 받아올 로직이 필요한데 아직 구성을 하지 않았기 때문입니다.

 

KakaoLogin 아래에 다음 코드를 추가해줍니다. 

class KakaoCallBack(APIView):
    def get(self, request):
        # 카카오 개발자 홈페이지의 REST KEY
        app_rest_api_key = '{REST KEY 값 입력}'
        
        # 카카오 개발자 홈페이지의 리다이렉트 URL
        redirect_uri = "http://127.0.0.1:8000/kakao/oauth"

        # 카카오 로그인에 호출 성공하면 인가코드를 넘겨준다.
        user_token = request.GET.get("code")

        # 인가코드를 이용해 토큰을 발급받는다
        token_request = requests.get(
            f"https://kauth.kakao.com/oauth/token?grant_type=authorization_code&client_id={app_rest_api_key}&redirect_uri={redirect_uri}&code={user_token}"
        )

        # 위에 api를 날리고 나서 응답으로 access_token이 온다. 이 토큰을 이용해 회원 정보를 조회한다.
        token_response_json = token_request.json()
        access_token = token_response_json.get("access_token")

        # kapi/kakao.com/v2/user/me 를 통해서 내정보를 조회한다. 동의한 것만 내려온다.
        profile_request = requests.get(
            "https://kapi.kakao.com/v2/user/me",
            headers={"Authorization": f"Bearer {access_token}"},
        )
        profile_json = profile_request.json()

        # 어떻게 오는지 한번 print로 찍어본다.
        print(profile_json)

        # 고유 id와 닉네임을 저장한다.
        id = profile_json.get("id")
        properties = profile_json.get("properties")
        nickname = properties.get('nickname')

        # 넘어온 고유 id가 회원가입 되어있는지 검사한다.
        user_in_db = User.objects.filter(email=id).first()
        if user_in_db is None:
            # 만약 없다면 화원가입 (User테이블에 데이터 생성)
            user_in_db = User.objects.create(email=id, password=id, nickname=nickname, name=nickname, profile_image='')

        # 로그인
        request.session['email'] = user_in_db.email
        request.session['login_check'] = True
        return render(request, 'learningspoons/main.html')

urls.py에 path('kakao/oauth', KakaoCallBack.as_view()) 도 추가로 입력해줍니다. 

다시 로그인 시도 후 사용자 계정 정보가 저장되는 데이터베이스 테이블을 확인해보면, 아래와 같이 카카오 로그인에서 사용하는 고유의 사용자 값이 저장되어 있음을 알 수 있습니다. 

 

'Django(웹서비스 만들기)' 카테고리의 다른 글

[9주차] 프로젝트-1  (0) 2022.01.15
[8주차] 쇼핑몰 페이지 만들기  (0) 2022.01.15
[6주차] AWS에 웹 서비스 배포하기  (0) 2021.12.29
[5주차] Git 사용하기  (0) 2021.12.24
[4주차] 사용자별 정보 다르게 출력하기  (0) 2021.12.16

관련글

티스토리툴바