Jhipster 应用中的 iframe 幻灯片 google 被阻止

Question

我使用 JHipster 6.9.1 生成器。我在组件中插入 Google 幻灯片 iframe :

<div>
       <br><br><br>
       <iframe src="https://docs.google.com/presentation/d/e/XXX/embed?start=false&loop=false&delayms=3000" frameborder="0" width="640" height="389" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>
   </div>

滑块在我使用 localhost:9000 时显示良好，但在我使用 localhost:8080 时显示不佳（滑块被遮挡）。我没有记录错误 :-s 只是 :

Ce contenu est bloqué. Pour résoudre le problème, contactez le propriétaire du site.

我试试 :

slider():SafeResourceUrl {
    return this.sanitizer.bypassSecurityTrustResourceUrl("https://docs.google.com/presentation/d/e/XXX/embed?start=false&loop=false&delayms=3000");
  }

 <iframe iframe [src]='slider()'  frameborder="0" width="640" height="389" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>

同样的错误。

感谢帮助

Answer 1

在 contentSecurityPolicy 中解析（WebSecurityConfigurerAdapter class 扩展）：

  @Override
    public void configure(HttpSecurity http) throws Exception {
        // @formatter:off
        http
            .csrf()
            .disable()
            .addFilterBefore(corsFilter, UsernamePasswordAuthenticationFilter.class)
            .exceptionHandling()
                .authenticationEntryPoint(problemSupport)
                .accessDeniedHandler(problemSupport)
        .and()
            .headers()
            .contentSecurityPolicy("script-src 'self' 'unsafe-inline' 'unsafe-eval' https://storage.googleapis.com; style-src 'self' 'unsafe-inline'; img-src 'self' data:; font-src 'self' data:")
        .and() ...

感谢@Gaël Marziou

Jhipster 应用中的 iframe 幻灯片 google 被阻止

Iframe slide google in Jhipster app is blocked

iframe

jhipster

content-security-policy

google-slides