A Política de Segurança de Conteúdo (CSP) é um mecanismo de segurança para navegadores que controla quais fontes externas — scripts, fontes, folhas de estilo e conexões de API — podem carregar na sua página web. Se seu site já tiver um CSP existente e você estiver incorporando o widget do Document360, deve adicionar as URLs de origem confiáveis do widget à sua política. Sem essas adições, o navegador bloqueará recursos de widgets, causando sintomas como barras de rolagem ausentes, fontes bloqueadas, falhas em chamadas de API ou erros de violação de CSP no console do navegador.
Antes de começar
- Confirme se sua base de conhecimento está hospedada na região dos EUA ou da UE — as URLs de origem confiável variam entre as regiões.
- Certifique-se de ter acesso ao HTML do seu site ou à configuração do servidor para editar o
Content-Security-Policycabeçalho ou<meta>a tag. - Identifique a variável nonce já disponível no seu sistema. Você precisará substituir
"document360Nonce"nos exemplos de código por esse valor.
Como adicionar fontes CSP confiáveis para o widget Document360
Atualize sua Política de Segurança de Conteúdo
Adicione as seguintes fontes às suas connect-src, script-src-elem, font-src, e style-src-elem diretivas.
Para usuários dos EUA
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Security-Policy" content="
connect-src
https://2ql92r65q8-dsn.algolia.net/
https://apihub.us.document360.io/
https://api.us.document360.io/
https://gateway.us.document360.io
https://*.algolianet.com
https://js.monitor.azure.com;
script-src-elem
'nonce-document360Nonce'
https://cdn.us.document360.io
https://*.algolianet.com
https://cdn.jsdelivr.net
https://cdnjs.cloudflare.com
https://floik.com/exe/
*.floik.com;
font-src
https://fonts.gstatic.com
https://cdn.us.document360.io;
style-src-elem
'unsafe-inline'
'unsafe-eval'
https://cdn.us.document360.io/
https://cdn.jsdelivr.net
https://fonts.googleapis.com;">
</head>
</html>
Substitua "document360Nonce" pela variável nonce já disponível no seu sistema.
Para usuários da UE
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Security-Policy" content="
connect-src
https://jx9o5re9su-dsn.algolia.net
https://apihub.document360.io/
https://api.document360.io/
https://gateway.document360.io
https://*.algolianet.com
https://js.monitor.azure.com;
script-src-elem
'nonce-document360Nonce'
https://cdn.document360.io
https://*.algolianet.com
https://cdn.jsdelivr.net
https://cdnjs.cloudflare.com
https://floik.com/exe/
*.floik.com;
font-src
https://fonts.gstatic.com
https://cdn.document360.io;
style-src-elem
'unsafe-inline'
'unsafe-eval'
https://cdn.document360.io/
https://cdn.jsdelivr.net
https://fonts.googleapis.com;">
</head>
</html>
Substitua "document360Nonce" pela variável nonce já disponível no seu sistema.
A URL do host do Algolia em connect-src é específica do ambiente. Se você não tiver certeza do anfitrião exato para o seu ambiente, use o coringa https://*.algolia.net na sua connect-src diretiva. Isso cobre todos os ambientes Algolia e previne erros CSP causados por nomes hosts incompatíveis.
Atualize a configuração do seu widget
- Vá para Conexões () > widget da base de conhecimento na barra lateral de navegação esquerda do portal da sua base de conhecimento.
- Selecione o widget necessário e clique em Editar ().
- Na aba Configurar e conectar , expanda o acordeão JavaScript do Widget no grupo Conexão .
- Atualize seu script de widget com o parâmetro nonce conforme mostrado abaixo.
Para clientes dos EUA
<!-- Document360 knowledge base assistant start -->
<script nonce="document360Nonce">
(function (w,d,s,o,f,js,fjs) {
w['JS-Widget']=o;w[o] = w[o] || function () { (w[o].q = w[o].q || []).push(arguments) };
js = d.createElement(s), fjs = d.getElementsByTagName(s)[0];
js.id = o; js.src = f; js.async = 1; fjs.parentNode.insertBefore(js, fjs);
}(panel, document, 'script', 'mw', './widget.js'));
mw('init', { nonce:'document360Nonce',apiKey: 'YOUR_API_KEY' });
//var jQuery_2_2_4 = $.noConflict(true);
</script>
<!-- Document360 knowledge base assistant end -->
Para clientes da UE
<!-- Document360 knowledge base assistant start -->
<script nonce="document360Nonce">
(function (w,d,s,o,f,js,fjs) {
w['JS-Widget']=o;w[o] = w[o] || function () { (w[o].q = w[o].q || []).push(arguments) };
js = d.createElement(s), fjs = d.getElementsByTagName(s)[0];
js.id = o; js.src = f; js.async = 1; fjs.parentNode.insertBefore(js, fjs);
}(panel, document, 'script', 'mw', './widget.js'));
mw('init', { nonce:'document360Nonce',apiKey: 'YOUR_API_KEY' });
//var jQuery_2_2_4 = $.noConflict(true);
</script>
<!-- Document360 knowledge base assistant end -->
Substitua "document360Nonce" pela variável nonce já disponível no seu sistema. O widget agora está configurado para operar de forma segura dentro do seu ambiente CSP.
FAQ
Por que a barra de rolagem não aparece no widget da Base de Conhecimento?
Isso é normalmente causado por uma regra CSP que bloqueia o domínio do widget. Se seu domínio não estiver listado no seu CSP, isso pode impedir que a funcionalidade de rolagem funcione corretamente. Adicione a URL do domínio ao CSP do seu aplicativo para resolver isso.
Preciso adicionar fontes CSP se não estiver usando um nonce?
Sim. Fontes CSP para connect-src, font-src, e style-src-elem são obrigatórias independentemente de você usar um nonce. O nonce é necessário especificamente para script-src-elem permitir a execução do script do widget. Sem o nonce, talvez você precise usar 'unsafe-inline' para scripts, o que não é recomendado.
Qual é a diferença entre as configurações CSP dos EUA e da UE?
As configurações dos EUA e da UE diferem nos domínios de endpoint CDN e API. Usuários dos EUA apontam para cdn.us.document360.io e api.us.document360.io, enquanto usuários da UE usam cdn.document360.io e api.document360.io. Usar URLs da região errada resultará em recursos bloqueados e widget não funcional.