Atributo allow do iframe não está funcionando

Adicionei um iframe do CodeSandbox com diferentes atributos, mas o Discourse está capturando apenas o src. Devo alterar algo nas configurações do Discourse? Já permiti esse iframe e ele está aparecendo, mas não corretamente.

Este é o iframe que estou tentando adicionar:

<iframe 
  src="https://codesandbox.io/embed/codesandbox-frontity-rnclp?fontsize=14" 
  title="Frontity - Post with recompose" 
  allow="geolocation; microphone; camera; midi; vr; accelerometer; gyroscope; payment; ambient-light-sensor; encrypted-media; usb" 
  style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;" 
  sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"
></iframe>

Mas ele está renderizando apenas isso:

Need_to_integrate_react-stripe-elements_-%F0%9F%A4%97_Dev_Talk___Questions-_Frontity_Community_Forum

Então o iframe não está sendo exibido corretamente:

3 curtidas

It works for me

Just to be sure, did you add the iframe url (https://codesandbox.io/embed/codesandbox-frontity-rnclp) in whitelist? If not, search the site setting allowed iframes.

1 curtida

I have this domain: https://codesandbox.io/. Shouldn’t be enough? I have found this code at Discourse where it whitelists just some iframe attributes:

If I include the attributes height and weight the iframe works fine, but I would like to allow the other attributes too.

Is there a way of allowing all codesandbox iframes? I thought including just the domain it would work.

Thank you!

EDIT:

I have tried adding this url in whitelist but it is not working neither.

3 curtidas

Eu também estou enfrentando esse problema. Gostaria de adicionar uma classe ao IFRAME que estou incorporando em minha postagem sobre política de privacidade, que carrega as configurações de rastreamento de privacidade da nossa instalação auto-hospedada do Matomo. Isso me permitiria adicionar uma borda mais estilizada e algumas cores para diferenciá-lo do restante da política de privacidade.

Apesar de ter um class="foo" no meu elemento IFRAME, ele está sendo removido, aparentemente pelo código de lista branca acima. Há alguma chance de isso poder ser expandido para permitir alguns atributos adicionais?

Por questões de segurança, somos muito rigorosos quanto a quais atributos HTML podem ser renderizados em nossa página quando vêm de entrada do usuário.

O que você pode fazer para obter isso é:

<div data-my-special-attr="42">
  <iframe src="http://example.com">
</div>

e, em seguida, direcionar isso com seu seletor CSS / JS:

div[data-my-special-attr="42"] > iframe {
  border-color: pink;
}
3 curtidas

Obrigado! Isso funcionou tanto na página do tópico quanto na página especial de política de privacidade renderizada.

Vale notar que, se alguém mais estiver tentando isso, você não pode adicionar um atributo class; literalmente, precisa adicionar um atributo no estilo data-foo-attr.

1 curtida

Rafael, obrigado pela declaração, isso esclarece o comportamento que observei.
Gostaria de saber se vocês têm planos de liberar o bloqueio para os atributos de áudio/vídeo de um iframe. Os navegadores modernos gerenciam bastante bem a acessibilidade para essas permissões, e há ofertas de serviços cada vez mais interessantes que seriam ótimas para os usuários integrarem, mas que simplesmente carecem desse tipo de acessibilidade.
Obrigado.

1 curtida

Estamos sempre abertos a feedback!

Fica mais fácil se conversarmos sobre aspectos específicos, como quais são os atributos exatos que você deseja incluir na lista de permissões e para quais serviços eles são necessários.

2 curtidas

ok. Eu especialmente penso em https://gitlab.com/jam-systems/jam, que precisaria de um parâmetro allow=“microphone *;” para funcionar corretamente.

Estou enfrentando o mesmo problema ao tentar incorporar um gravador de áudio H5P; a opção allow="microphone *;" está sendo removida do iframe.

O que seria necessário para talvez ter uma configuração de iframe que permita essas permissões?

Podemos permitir que os administradores especifiquem quais atributos de iframe eles querem permitir na lista de permissões?

1 curtida

Isso seria útil, mas também ficaríamos satisfeitos se o atributo allow fosse incluído na lista de permissões para todos. Atualmente, estamos enfrentando problemas de reprodução de áudio com players de podcast incorporados da Apple e do Spotify. Como outros mencionaram, o problema é que o atributo allow está sendo removido, o que contém uma diretiva importante encrypted-media.

1 curtida

Como já somos rigorosos quanto aos domínios que podem ser usados em iframes, ter mais uma configuração onde definimos a string allow para cada iframe e analisamos o formato estranho do conteúdo allow parece um pouco demais para mim.

Fiz um PR que simplesmente permite o uso de qualquer coisa no atributo allow para iframes já permitidos:

O que você acha @sam?

3 curtidas

Hmm, acho que estou bem com isso, vejo sua lógica aqui, @david alguma objeção?

1 curtida

Esta alteração foi mesclada @santosguillamot @selfscrum @cogdog @gilby

3 curtidas