Springboot-资源解释为样式表，但以MIME类型text/htm传输 [英] Springboot - Resource interpreted as Stylesheet but transferred with MIME type text/htm
问题描述
我以前对此问题有很多答案，但是我尝试过的解决方案都没有.
I see a number of answers to this question previously but none of the solutions I have tried worked.
我的login.css未被应用到我的Spring Boot应用程序中的login.html.我也在用Thymeleaf.
My login.css is not getting applied to login.html in my Spring Boot application. I am also using Thymeleaf.
安全性已打开-但我不认为这是浏览器中的问题.我看不到加载login.css失败-仅显示以下消息:
Security is turned on - but I do not think this is the issue as in the browser. I do not see a failure to load login.css - only the message:
资源被解释为样式表，但以MIME类型text/html传输:
Resource interpreted as Stylesheet but transferred with MIME type text/html:
在浏览器中进行的进一步检查显示它正在请求text/css，但得到了text/html响应.
Further inspection in the browser shows it is requesting text/css, but getting a text/html response.
html:
<!doctype html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4">
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatiable" content="IE-Edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta name="Login"/>
<title>LOGIN</title>
<!-- Latest compiled and minified CSS -->
....
<link rel="stylesheet" href="login.css" content-type="text/css"/>
login.html
\src\main\resources\templates\login.html
login.css
\src\main\resources\static\login.css
以防万一我提出了权限问题:
And just in case it was a permissions issue I put:
.antMatchers("/css/**").permitAll()
我注意到通过CDN交付的所有CSS都没有问题.浏览器还将返回带有 302状态代码的login.css.
I noted there is no issue with all the css delivered via CDN. Also the browser is returning the login.css with a 302 status code.
谢谢
推荐答案
在使用 Spring Boot + Spring MVC 编写一些代码时，我遇到了完全相同的问题.使用CDN设置的CSS文件可以正常工作，而从我的static/css文件夹中设置的CSS文件返回了HTML内容.
I had the exact same issue while writing some code with Spring Boot + Spring MVC. The CSS files set using a CDN worked fine, while the CSS file set from my static/css folder returned a HTML content.
示例:
<!-- This first worked fine, loading all styles -->
<link th:href="@{/webjars/bootstrap/3.3.7/css/bootstrap.min.css}"
href="http://cdn.jsdelivr.net/webjars/bootstrap/3.3.7/css/bootstrap.min.css"
rel="stylesheet" media="screen" />
<!-- This second one returned the content of an HTML - Content Type text/html -->
<link rel="stylesheet" th:href="@{/css/login/style.css}" href="/css/login/style.css" />
过一会儿，我可以看到使用 Chrome开发工具，我的本地style.css返回的内容与我的HTML页面之一相同.
After a while I could see using Chrome Dev Tools that the content returned for my local style.css was the same as one of my HTML pages.
检查指向带有该内容的HTML文件的路由，我可以意识到我为@RequestMapping配置使用了错误的属性.我有@RequestMapping(name="...")，而不是@RequestMapping(path="...").
Inspecting the route that pointed to the HTML file with that content, I could realise I was using the wrong property for the @RequestMapping configuration. I had @RequestMapping(name="..."), instead of @RequestMapping(path="...").
出现问题的控制器
@RequestMapping(name = "/product/add", method = RequestMethod.GET)
public String add(Model model) {
model.addAttribute("product", new Product());
return "product/edit";
}
控制器已更改
@RequestMapping(path = "/product/add", method = RequestMethod.GET)
public String add(Model model) {
model.addAttribute("product", new Product());
return "product/edit";
}
为path更改属性name后，所有内容都开始正确加载.
After changing the property name for path everything started being loaded correctly.
奇怪的是，这样的小错误如何影响了我的整个程序.
It was strange how a small mistake like this affected my whole program.
希望这对于面临相同问题的人很有用.
Hope it's somehow useful for someone who faces the same issue.
这篇关于Springboot-资源解释为样式表，但以MIME类型text/htm传输的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
