OAuth 2.0 Aplicación de ejemplo | Documentación del Centro de creación de Roblox

Roblox proporciona una aplicación de muestra de JavaScript que muestra cómo usar OAuth 2.0 para permitir que los usuarios inicien sesión en sus cuentas Roblox y transmitan mensajes de anuncios a través de sus experiencias. Esta aplicación usa el código de autorización sin PKCE y, por lo tanto, solo es adecuada para clientes confidenciales, como servidores privados.

Después de descargar el archivo .zip, extraígelo en su propia carpeta.

Registrando la aplicación

El primer paso para configurar la aplicación es registrarla en el sitio web de Roblox y copiar la ID del cliente y la contraseña en algún lugar seguro. Luego siga los pasos de registro estándar con estas configuraciones:

Bajo permisos, agregue el openid, profile y 2> universe-messaging-service:publicar2> escenarios.
Bajo Redirigir URLs , agrega el http://localhost:3000/oauth/callback redirección. Si desea utilizar un puerto no predeterminado para su aplicación (app), especifíquelo aquí.

Configurando variables de entorno

En lugar de almacenarlos en código (no recomendado), el cliente utiliza variables de entorno para su ID de cliente y contraseña. El proceso para agregar variables de entorno difiere según el sistema operativo.

En Windows, ejecuta los siguientes comandos de 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.

En Mac y la mayoría de las distribuciones Linux, ejecute estos comandos en el terminal:


export ROBLOX_CLIENT_ID=your_client_id_here
export ROBLOX_CLIENT_SECRET=your_client_secret_here
export ROBLOX_PORT=3000 # Optional. Default is 3000.

Si especificó un puerto no predeterminado en la URL de redirección al registrar su aplicación (app), asegúrese de agregar la variable ROBLOX_PORT.

Estos comandos solo establecen variables de entorno para la duración de tu sesión de terminal. Si quieres cargar estas variables cada vez que abras una nueva ventana de terminal, añade los comandos a tu archivo de configuración de shell, como .zshrc o .bashrc . Muchos servicios de alojamiento tienen características para ayudarlo a agregar variables de entorno a sus servidores.

Instalando Dependencias

La aplicación tiene una docena de dependencias, visibles en package.json . Para instalarlas, ejecutar:


npm ci

Ejecutando el App

Para iniciar la aplicación (app), ejecutar:


npm start

Luego navegue a http://localhost:3000 (o su puerto no predeterminado) en un navegador web.

La aplicación te redirige inmediatamente a la pantalla de inicio de sesión de Roblox, en la que puedes iniciar sesión, verificar las autorizaciones que solicita la aplicación y hacer clic en Confirmar y dar acceso .

Roblox luego te redirige de vuelta a localhost , donde puedes ver que la aplicación ahora muestra algunos datos mínimos del usuario, un enlace de tu perfil en Roblox y campos que puedes usar para transmitir mensajes en tus experiencias.

Sobre la aplicación

En líneas generales, index.js realiza las siguientes operaciones:

Inicia un nuevo servidor web usando express .
Recupera la configuración de Roblox OpenID Connect (OIDC), que incluye endpoints para la autorización, información del usuario, etc. Para obtener más información sobre estos endpoints, see Autentificación de OAuth 2.0 .
Crea un nuevo cliente de ID abierto usando openid-client y sus credenciales almacenadas. Este cliente simplifica drásticamente el proceso de formar y enviar solicitudes HTTP a los puntos de finalización de OAuth 2.0.
Define las rutas para la aplicación (app), incluida la redirección para los flujos de inicio de sesión y salida y el retorno de llamadas OAuth 2.0.
Después de un inicio de sesión exitoso, almacena las varias fichas como galletas, junto con algunos datos mínimos del usuario que se muestran como HTML con ayuda de getHomeHtml.js .