Configuração CSP
Se você usa Content Security Policy (CSP) em seu site, você precisa configurá-lo para permitir que a Rybená funcione corretamente.
Configuração Recomendada
Content-Security-Policy:
default-src 'self';
script-src 'self' cdn.rybena.com.br libras.rybena.com.br;
connect-src 'self' libras.rybena.com.br tts.rybena.com.br dicio.rybena.com.br repository.rybena.com.br;
frame-src repository.rybena.com.br;
style-src 'self' 'unsafe-inline';
img-src 'self' data: cdn.rybena.com.br libras.rybena.com.br repository.rybena.com.br;
font-src 'self' cdn.rybena.com.br repository.rybena.com.br;
media-src 'self' repository.rybena.com.br;
object-src 'none';Explicação das Diretivas
| Diretiva | Propósito |
|---|---|
script-src | Permite carregar scripts do CDN da Rybená |
connect-src | Permite conexões com os servidores de tradução e TTS |
frame-src | Permite iframes do repositório de recursos |
style-src | Permite estilos inline necessários para o player |
img-src | Permite carregar imagens dos servidores da Rybená |
font-src | Permite carregar fontes dos servidores da Rybená |
media-src | Permite carregar mídia (vídeos, áudios) do repositório |
Exemplo em HTML
<meta
http-equiv="Content-Security-Policy"
content="default-src 'self'; script-src 'self' cdn.rybena.com.br libras.rybena.com.br; connect-src 'self' libras.rybena.com.br tts.rybena.com.br dicio.rybena.com.br repository.rybena.com.br; frame-src repository.rybena.com.br; style-src 'self' 'unsafe-inline'; img-src 'self' data: cdn.rybena.com.br libras.rybena.com.br repository.rybena.com.br; font-src 'self' cdn.rybena.com.br repository.rybena.com.br; media-src 'self' repository.rybena.com.br; object-src 'none';"
/>Exemplo em Next.js
// next.config.js
const cspHeader = `
default-src 'self';
script-src 'self' cdn.rybena.com.br libras.rybena.com.br;
connect-src 'self' libras.rybena.com.br tts.rybena.com.br dicio.rybena.com.br repository.rybena.com.br;
frame-src repository.rybena.com.br;
style-src 'self' 'unsafe-inline';
img-src 'self' data: cdn.rybena.com.br libras.rybena.com.br repository.rybena.com.br;
font-src 'self' cdn.rybena.com.br repository.rybena.com.br;
media-src 'self' repository.rybena.com.br;
object-src 'none';
`;
module.exports = {
async headers() {
return [
{
source: "/:path*",
headers: [
{
key: "Content-Security-Policy",
value: cspHeader.replace(/\n/g, ""),
},
],
},
];
},
};Exemplo em Nginx
# nginx.conf
add_header Content-Security-Policy "default-src 'self'; script-src 'self' cdn.rybena.com.br libras.rybena.com.br; connect-src 'self' libras.rybena.com.br tts.rybena.com.br dicio.rybena.com.br repository.rybena.com.br; frame-src repository.rybena.com.br; style-src 'self' 'unsafe-inline'; img-src 'self' data: cdn.rybena.com.br libras.rybena.com.br repository.rybena.com.br; font-src 'self' cdn.rybena.com.br repository.rybena.com.br; media-src 'self' repository.rybena.com.br; object-src 'none';" always;Exemplo em Apache
# .htaccess
<IfModule mod_headers.c>
Header always set Content-Security-Policy "default-src 'self'; script-src 'self' cdn.rybena.com.br libras.rybena.com.br; connect-src 'self' libras.rybena.com.br tts.rybena.com.br dicio.rybena.com.br repository.rybena.com.br; frame-src repository.rybena.com.br; style-src 'self' 'unsafe-inline'; img-src 'self' data: cdn.rybena.com.br libras.rybena.com.br repository.rybena.com.br; font-src 'self' cdn.rybena.com.br repository.rybena.com.br; media-src 'self' repository.rybena.com.br; object-src 'none';"
</IfModule>CORS para Descrição de Imagem por IA
A legenda comum de imagem usa o atributo alt e não precisa ler os pixels do arquivo. Já o recurso de descrição por IA (RybenaImageTooltipAI) precisa baixar a imagem e acessar seus pixels no navegador — isso exige CORS, não apenas CSP.
Quando a imagem está hospedada em outro domínio, o servidor que entrega o arquivo precisa autorizar a origem do site:
Access-Control-Allow-Origin: https://www.seu-dominio.com.brPara imagens públicas, também é possível usar:
Access-Control-Allow-Origin: *Esse cabeçalho deve estar presente nas respostas e nos redirecionamentos envolvidos no carregamento da imagem. A imagem pode aparecer normalmente na página e, ainda assim, não permitir que a Rybená leia seu conteúdo.
Usar mode: no-cors ou definir apenas crossOrigin no navegador não contorna essa restrição: a resposta permanece opaca e não pode ser convertida em dados para a descrição por IA. Se o servidor das imagens não puder ser configurado, mantenha um texto alternativo (alt) adequado e use a legenda comum.
Sem CORS configurado no servidor da imagem, a descrição por IA não consegue processar imagens externas. Verifique o console do navegador por mensagens de bloqueio de CORS.
Dica: Esta configuração permite que todos os recursos necessários para o funcionamento da Rybená sejam carregados corretamente, mantendo a segurança do seu site.
Próximos Passos
Agora que você configurou o CSP, você pode:
Desabilitando Funcionalidades
Você pode desabilitar funcionalidades específicas do +Acessibilidade Rybená através de meta tags no HTML.
Suporte e Solução de Problemas
Nosso compromisso é oferecer um atendimento ágil, eficiente e personalizado para garantir que sua experiência com nossas soluções de acessibilidade digital seja sempre positiva e produtiva. A equipe de suporte Rybená está preparada para auxiliar em questões técnicas, operacionais e de uso da plataforma.