twitch drops and web login develoment(트위치 웹 로그인 및 트위치 드랍스 개발) - 작성 중

twitch drops 서비스를 개발하기 위한 내용을 간단히 정리합니다.(메모 목적이라서 생략된 부분이 많습니다.)

 

이미 원신(링크) 등에서 사용하고 있어서 참고하였습니다.

 

1. 준비 필요 사항
   1. 트위치 개발자 사이트에서 개발자 설정 및 어플리케이션 추가
      1. 2차인증 등 보안 관련 꽤 설정할게 많았음

트위치 개발자 사이트에서 응용 프로그램을 등록하는 메뉴(위 캡쳐는 테스트용 어플리케이션이 이미 등록된 후 화면)

응용프로그램 상세 설정 화면. 시크릿은 서비키로 사용하기에 보안 주의하여 관리

---

1. 트위치 웹 로그인을 위한 URL확인
   1. 트위치가 OIDC방식을 지원함(참고 링크)
      1. OIDC 여러 response_type(적용방법?)이 존재하는데 'OIDC authorization code grant flow' 사용
   2. 원신 예
      1.  원신은 아래와 같은 URL을 사용하고 있고 URL디코딩을 하면 어떤 파라미터로 트위치에 요청하는지 알 수 있었음
         1. https://id.twitch.tv/oauth2/authorize?claims=%7B%22id_token%22%3A%7B%22iss%22%3A%22%22%2C%22sub%22%3A%22%22%2C%22aud%22%3A%22%22%2C%22exp%22%3A0%2C%22iat%22%3A0%2C%22nonce%22%3A%22%22%2C%22picture%22%3A%22%22%2C%22preferred_username%22%3A%22%22%7D%2C%22userinfo%22%3A%7B%22picture%22%3A%22%22%2C%22preferred_username%22%3A%22%22%7D%7D&client_id=qb4j308hke6jw76fzou0taq6jfzgjz&force_verify=true&redirect_uri=https%3A%2F%2Fsg-hk4e-api.hoyoverse.com%2Fevent%2Fring%2Fhk4e_global%2Ftwitch%2Fexchange&response_type=code&scope=openid&state=1657158098
            1. URL 디코딩 결과 내용
               1. https://id.twitch.tv/oauth2/authorize?claims={"id_token":{"iss":"","sub":"","aud":"","exp":0,"iat":0,"nonce":"","picture":"","preferred_username":""},"userinfo":{"picture":"","preferred_username":""}}&client_id=qb4j308hke6jw76fzou0taq6jfzgjz&force_verify=true&redirect_uri=https://sg-hk4e-api.hoyoverse.com/event/ring/hk4e_global/twitch/exchange&response_type=code&scope=openid&state=1657158098
      2. 위 URL 내용을 참고하여 만들려고 하는 본인의 어플리케이션에 맞게 파라미터를 변경함. 이때 파라미터의 내용은 트위치 개발자 사이트를 참고
         1.  redirect_uri에 본인의 서버쪽에서 검증
   3. 트위치 드랍스 기능 구현
      1. twitch drops guide
   4. 기타 사항 추가로 작성 예정