OAuth 2.0 샘플 앱

Roblox는 사용자가 Roblox 계정에 로그인하고 자신의 게임에서 메시지를 방송할 수 있도록 OAuth 2.0을 사용하는 방법을 보여주는 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 # 선택 사항. 기본값은 3000입니다.

Mac 및 대부분의 Linux 배포판에서는 터미널에서 다음 명령어를 실행하십시오:

export ROBLOX_CLIENT_ID=your_client_id_here
export ROBLOX_CLIENT_SECRET=your_client_secret_here
export ROBLOX_PORT=3000 # 선택 사항. 기본값은 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 클라이언트를 만듭니다. 이 클라이언트는 OAuth 2.0 엔드포인트에 대해 HTTP 요청을 올바르게 형성하고 전송하는 과정을 크게 단순화합니다.
4. 로그인 및 로그아웃 흐름, OAuth 2.0 콜백을 포함하여 앱의 라우트를 정의합니다.
5. 성공적으로 로그인하면 다양한 토큰을 쿠키로 저장하고, getHomeHtml.js의 도움으로 HTML로 표시되는 최소한의 사용자 정보를 저장합니다.