Al ejecutar una Actividad de Discord a través de Discord, es posible que encuentres problemas con la Política de seguridad de contenido (CSP). Puede solucionar estos problemas asegurándose de que las solicitudes de red sigan las reglas de Discord Proxy.

Esto se puede hacer manualmente... o puedes dejar que @robojs/patch se encargue de ello.

¿Qué es la CSP?

Política de seguridad de contenido (CSP) es un estándar de seguridad que ayuda a prevenir ataques Cross-Site Scripting (XSS). Controla qué recursos puede cargar una página y dónde puede enviar datos.

Cuando ejecutas una Actividad de Discord en Discord, en realidad estás usando el Discord Proxy como intermediario, lo que significa que establece su propio Reglas CSP. Si sus solicitudes de red no siguen estas reglas, serán bloqueadas.

• Las solicitudes relativas como /api/token se bloquearán a menos que tengan el prefijo /.proxy.
• Las solicitudes externas como https://example.com/api/token se bloquearán a menos que estén asignadas o proxy.

Resolución de infracciones de CSP

Como se indicó anteriormente, todo lo que tienes que hacer es asegurarte de que tus solicitudes de red sigan las reglas de Discord Proxy. En algunos casos, eso incluye agregar /.proxy al comienzo de la ruta de su solicitud.

// Before
fetch('/api/token')

// After
fetch('/.proxy/api/token')

Sin embargo, WebSockets puede ser un poco más complicado. Especialmente cuando dependes de Reemplazo de módulo en caliente (HMR) que se carga antes de tu propia actividad como en Vite. Entonces, creamos @robojs/patch para que se encargue de todo por usted.

Parcheando tu actividad

@robojs/patch es un paquete liviano que parchea tus solicitudes de red para que sigan las reglas de Discord Proxy. Funciona actualizando los globales fetch y WebSocket.

npm install @robojs/patch

Tenemos diferentes formas de aplicar este parche dependiendo de la configuración de tu proyecto.

Método 1: complemento Vite (recomendado)

Si estás usando Vite, puedes aplicar el parche como un complemento en tu archivo de configuración de Vite.

import { DiscordProxy } from '@robojs/patch'
import { defineConfig } from 'vite'

export default defineConfig({
    plugins: [DiscordProxy.Vite()]
})

Recomendamos este método porque permite que el parche se ejecute antes que el cliente HMR de Vite, lo que garantiza que funcione correctamente.

Método 2: llamada a función

Si no estás usando Vite, puedes aplicar el parche llamando a una función directamente.

import { DiscordProxy } from '@robojs/patch'

DiscordProxy.patch()

Asegúrese de llamar a esto al comienzo de su proyecto, antes de que se carguen otros scripts. (por ejemplo, la parte superior de su archivo index.js)

➞? Documentación: @robojs/patch

Solicitudes externas

Esto no afecta las solicitudes realizadas a URL externas. Si tiene problemas de CSP con ellos, es posible que pueda solucionarlos creando su propio Proxy o mapeándolos en el Portal para desarrolladores de Discord.

➞? Tutorial: Resolver problemas de CSP con un proxy

Resuelva problemas de política de seguridad de contenido (CSP) en su actividad de Discord utilizando un proxy Node.js

Personal de WavePlay para WavePlay ・ 17 de junio

#discordia #programación #nodo #javascript

¿Interesado en actividades de Discord?

Robo.js es un marco poderoso para crear actividades de Discord con facilidad. ¡Proporciona una amplia gama de funciones y herramientas para ayudarte a crear experiencias épicas en Discord!

Únete a nuestro Servidor de Discord para chatear con otros desarrolladores, hacer preguntas y compartir tus proyectos. ¡Somos un grupo amigable y siempre estamos felices de ayudar! Además, nuestro propio AI Robo, Sage, está ahí para ayudarte con cualquier pregunta que puedas tener.

➞? Comunidad: Únase a nuestro servidor de Discord

➞? Tutorial: Creando una actividad de Discord en segundos con Robo.js

Robo - Imagina Magia

¡Enciende Discord con actividades sencillas, bots, servidores y más! ⚡ | 83 miembros

discord.com

Creando una actividad de Discord en segundos con Robo.js

Personal de WavePlay para WavePlay ・ 9 de abril

#discordia #sdk #javascript #bot