OAuth 2.0 예제 앱

*이 콘텐츠는 AI(베타)를 사용해 번역되었으며, 오류가 있을 수 있습니다. 이 페이지를 영어로 보려면 여기를 클릭하세요.

Roblox는 OAuth 2.0을 사용하여 사용자가 Roblox 계정에 로그인하고 경험 전반에 걸쳐 메시지를 방송하는 방법을 보여주는 Node.js 샘플 앱을 제공합니다.이 앱은 PKCE(개인 서버와 같은 기밀 클라이언트)를 사용하지 않고 권한 코드 흐름을 사용하여 승인 코드 흐름을 사용하지 않으므로 개인 서버와 같은 기밀 클라이언트에만 적합합니다.


다운로드한 .zip 파일을 자체 폴더로 추출합니다.

앱 등록

앱을 설정하기 위한 첫 번째 단계는 Roblox 웹사이트에 등록하고 클라이언트 ID와 비밀을 안전한 곳에 복사하는 것입니다.그런 다음 이러한 설정으로 표준 등록 단계를 따르십시오:

  1. 아래에서 권한 , openid , profile 및 universe-messaging-service:publish 범위를 추가합니다.
  2. 아래의 리디렉션 URL 에서, http://localhost:3000/oauth/callback을 추가하십시오. 앱에 기본 포트가 아닌 포트를 사용하려는 경우 여기에 지정하십시오.

환경 변수 설정

코드에 저장하는 대신 (권장되지 않음) 앱은 클라이언트 ID와 비밀에 대한 환경 변수를 사용합니다.환경 변수 추가 프로세스는 운영 체제에 따라 다릅니다.

Windows에서 다음 PowerShell 명령을 실행합니다:

$env:ROBLOX_CLIENT_ID='your_client_id_here'

$env:ROBLOX_CLIENT_SECRET='your_client_secret_here'

$env:ROBLOX_PORT=3000 # Optional. Default is 3000.

Mac과 대부분의 Linux 배포에서는 터미널에서 다음 명령을 실행합니다.

export ROBLOX_CLIENT_ID=your_client_id_here

export ROBLOX_CLIENT_SECRET=your_client_secret_here

export ROBLOX_PORT=3000 # Optional. Default is 3000.

앱을 등록할 때 기본 포트가 아닌 포트를 리디렉션 URL에 지정했다면 ROBLOX_PORT.

종속성 설치

앱에는 몇 가지 종속성이 있으며, package.json에서 볼 수 있습니다. 설치하려면 실행하십시오.

npm ci

앱 실행

앱을 시작하려면 실행:

npm start

그런 다음 웹 브라우저에서 http://localhost:3000로 이동합니다.

앱은 즉시 Roblox 로그인 화면으로 리디렉션하여 로그인하고, 앱이 요청하는 권한을 확인하고, 확인 및 액세스 부여 를 클릭할 수 있습니다.

Roblox는 그런 다음 localhost로 다시 리디렉션하여 앱이 현재 약간의 최소 사용자 정보, Roblox의 프로필로 연결되는 링크, 그리고 경험 전반에 메시지를 방송할 수 있는 필드를 표시하고 있음을 볼 수 있습니다.

앱에 대해

큰 틀에서, index.js 는 다음 작업을 수행합니다:

  1. express를 사용하여 새 웹 서버를 시작합니다.
  2. 승인, 사용자 정보 등을 포함하는 Roblox OpenID Connect(OIDC) 구성을 검색합니다.이러한 끝점에 대한 자세한 정보는 OAuth 2.0 인증을 참조하십시오.
  3. openid-client 및 저장된 자격 증명을 사용하여 새 Open ID 클라이언트를 생성합니다.이 클라이언트는 HTTP 요청을 OAuth 2.0 끝점에 적절하게 형식화하고 전송하는 과정을 극적으로 단순화합니다.
  4. 로그인 및 로그아웃 흐름과 OAuth 2.0 콜백에 대한 리디렉션을 포함하여 앱의 경로를 정의합니다.
  5. 성공적으로 로그인한 후, 여러 토큰을 쿠키로 저장하고, getHomeHtml.js의 도움으로 HTML로 표시하는 일부 최소 사용자 정보도 저장합니다.