拒绝在 Thymeleaf 中显示图像

Question

我有一个 SpringBoot 2.1.7.RELEASE 应用程序。使用 Thymeleaf 模板引擎 我在 Thymeleaf 模板中添加了这段代码，但图像没有显示出来

<object data="assets/img/icons/ico_status_up.svg" type="image/svg+xml">
    <img th:src="@{assets/img/icons/ico_status_up.png}"  alt="UP">
</object>

我在浏览器的控制台中看到了这个错误：

Refused to display 'http://localhost:8080/bonanza/pecador/assets/img/icons/ico_status_up.svg' in a frame because it set 'X-Frame-Options' to 'deny'.

我在我的项目中使用 spring-security：

<dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-security</artifactId>
        </dependency>

        <!-- Spring Security -->
        <dependency>
            <groupId>org.thymeleaf.extras</groupId>
            <artifactId>thymeleaf-extras-springsecurity5</artifactId>
        </dependency>

   <dependency>
            <groupId>org.springframework.security</groupId>
            <artifactId>spring-security-test</artifactId>
            <scope>test</scope>
        </dependency>

Answer 1

问题是您可能正在使用 authconfigured Spring Security 模块。

如Spring Security Docs 中所述：

解决点击劫持的一种更现代的方法是使用 X-Frame-Options 标头：

X-Frame-Options：拒绝

X-Frame-Options 响应标头指示浏览器阻止响应中包含此标头的任何站点在框架内呈现。 默认情况下，Spring Security 禁用 iframe 内的渲染。

所以要配置这个行为，你应该配置你的 Spring Security：

@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http
        // ...
        .headers()
            .frameOptions()
                .sameOrigin(); // or disable();
    }
}

此外，我鼓励您查看 SO question，该问题涵盖了有关使用什么 html 标记来显示 SVG 的主题 - Do I use <img>, <object>, or <embed> for SVG files?