Usar uma política de segurança de conteúdo com a biblioteca de clientes do SDK do Amazon Chime para JavaScript - SDK do Amazon Chime

Usar uma política de segurança de conteúdo com a biblioteca de clientes do SDK do Amazon Chime para JavaScript

Os aplicativos web modernos usam uma política de segurança de conteúdo para proteger os usuários de determinadas classes de ataques. As aplicações que usam o VideoFxProcessor devem incluir as diretivas de políticas descritas nesta seção. As diretivas dão ao SDK do Amazon Chime acesso aos recursos necessários em runtime.

Diretivas de política de segurança de conteúdo necessárias

Você deve usar as seguintes diretivas de política de segurança de conteúdo.

  • Com relação a script-src:, adicione blob: https://*.sdkassets.chime.aws para carregar o código de processamento de vídeo, e wasm-unsafe-eval para permitir sua execução.

  • Com relação a script-src-elem:, adicione blob: https://*.sdkassets.chime.aws para carregar o código de processamento de vídeo da origem.

  • Com relação a worker-src:, adicione blob: https://*.sdkassets.chime.aws para carregar o operador JavaScript em todas as origens.

Se você omitir qualquer uma dessas entradas ou usar cabeçalhos HTTP e metatags http-equiv para especificar uma política e excluir inadvertidamente qualquer uma delas por interseção, um filtro de plano de fundo não poderá ser inicializado. O filtro parece não ser suportado ou cria um processador de quadros de vídeo autônomo. Você verá erros no console do seu navegador, como:

Refused to connect to 'https://static.sdkassets.chime.aws/bgblur/workers/worker.js…' because it violates the document's content security policy.

Diretivas de política de script necessárias

Para funcionar, a classe VideoFxProcessor deve carregar classes de JavaScript em runtime a partir de uma rede de distribuição de conteúdo da Amazon. Essas classes usam WebGL2 para implementar o pós-processamento de vídeo. Para permitir que um aplicativo busque e execute essas classes, você deve incluir as seguintes diretivas:

  • script-src 'self' blob: https://*.sdkassets.chime.aws

  • script-src-elem 'self' blob: https://*.sdkassets.chime.aws

nota

Para obter suporte completo no Safari e no Firefox, você deve usar as diretivas script-src e script-src-elem.

Diretiva de política do operador

O VideoFxProcessor carrega classes de JavaScript como um blob para executar um tópico de operador web. O tópico usa modelos de machine learning para processar vídeos. Para conceder acesso a um aplicativo para buscar e usar esse operador, inclua a seguinte diretiva:

worker-src 'self' blob: https://*.sdkassets.chime.aws

Política de WebAssembly

O VideoFxProcessor carrega um módulo WebAssembly (WASM) da mesma rede de distribuição de conteúdo de propriedade da Amazon. No Chrome 95 e versões posteriores, os módulos WASM compilados não podem ser transmitidos pelos limites de vários módulos. Para permitir a busca e a instanciação desses módulos, inclua 'wasm-unsafe-eval' na diretiva script-src.

Para mais informações sobre a documentação da Política de Segurança de Conteúdo para o WebAssembly, consulte a Política de Segurança de Conteúdo do WebAssembly no GitHub.

(Opcional) Diretiva de política de imagem de plano de fundo

Para usar uma imagem de plano de fundo carregada dinamicamente com um filtro de substituição de plano de fundo, o VideoFxProcessor deve ter acesso à imagem. Para fazer isso, inclua uma diretiva connect-src com o domínio que hospeda a imagem.

Exemplo de política de segurança de conteúdo

O exemplo de política a seguir permite que você use o VideoFxProcessor. As definições connect-src não são específicas para um VideoFxProcessor. Em vez disso, eles estão relacionados ao áudio e ao vídeo de uma reunião do SDK do Amazon Chime.

<head> <meta http-equiv="Content-Security-Policy" content="base-uri 'self'; connect-src 'self' https://*.chime.aws wss://*.chime.aws https://*.amazonaws.com wss://*.chime.aws https://*.ingest.chime.aws; script-src 'self' blob: 'wasm-unsafe-eval' https://*.sdkassets.chime.aws; script-src-elem 'self' blob: https://*.sdkassets.chime.aws; worker-src 'self' blob: https://*.sdkassets.chime.aws;"> </head>

Erros na política de segurança de conteúdo

Se você omitir qualquer uma das diretivas necessárias, o VideoFxProcessor não instanciará e não terá suporte. Nesse caso, o erro a seguir (ou similar) aparece no console do navegador:

Refused to connect to 'https://static.sdkassets.chime.aws/ml_media_fx/otherassets/worker.js' because it violates the document's content security policy.

Política de segurança de conteúdo de abertura de origem cruzada

Para limitar o uso de memória, o módulo prefere usar o SharedArrayBuffer para processamento. No entanto, isso requer que você configure cuidadosamente a segurança da web. Você deve definir os seguintes cabeçalhos ao servir o HTML do seu aplicativo:

Cross-Origin-Opener-Policy: same-origin Cross-Origin-Embedder-Policy: require-corp

O servidor deve configurá-los porque eles não têm equivalentes de meta-tag. Se você não definir esses cabeçalhos, os filtros de plano de fundo poderão usar um pouco mais de RAM.

Os filtros de plano de fundo podem ser intensivos em CPU e GPU. Alguns dispositivos móveis e notebooks ou desktops com especificações mais baixas podem não ter a capacidade de executar os filtros junto com várias transmissões de vídeo.