Thanks！I've finish this problem! I add
protected void addResourceHandlers(ResourceHandlerRegistry registry)
{
registry.addResourceHandler("/static/**").addResourceLocations(ResourceUtils.CLASSPATH_URL_PREFIX + "/static/");
super.addResourceHandlers(registry);
}
in application, then the bug disappears.
Recently, in learning spring boot through the book "spring-boot-in-action", I encountered the following problems
When the program runs, I open the webpage and find that the line "Xmlns: th= 'http://www.thymeleaf.org'" has not been executed, and the CSS file has not been invoked.
Attached below are HTML source code, build. gradle configuration and web controller:
HTML source code:
<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head>
<title>Reading List</title>
<link rel="stylesheet" th:href="#{/style.css}"></link>
</head>
<body>
<h2>Your Reading List</h2>
<div th:unless="${#lists.isEmpty(books)}">
<dl th:each="book : ${books}">
<dt class="bookHeadline">
<span th:text="${book.title}">Title</span> by
<span th:text="${book.author}">Author</span>
(ISBN: <span th:text="${book.isbn}">ISBN</span>)
</dt>
<dd class="bookDescription">
<span th:if="${book.description}"
th:text="${book.description}">Description</span>
<span th:if="${book.description eq null}">
No description available</span>
</dd>
</dl>
</div>
<div th:if="${#lists.isEmpty(books)}">
<p>You have no books in your book list</p>
</div>
<hr/>
<h3>Add a book</h3>
<form method="POST">
<label for="title">Title:</label>
<input type="text" name="title" size="50"></input><br/>
<label for="author">Author:</label>
<input type="text" name="author" size="50"></input><br/>
<label for="isbn">ISBN:</label>
<input type="text" name="isbn" size="15"></input><br/>
<label for="description">Description:</label><br/>
<textarea name="description" cols="80" rows="5">
</textarea><br/>
<input type="submit"></input>
</form>
</body>
</html>
gradle configuration
dependencies {
implementation 'org.springframework.boot:spring-boot-starter-data-jpa'
implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
implementation 'org.springframework.boot:spring-boot-starter-web'
runtimeOnly 'com.h2database:h2'
testImplementation 'org.springframework.boot:spring-boot-starter-test'
}
web controller prtSc:(I'm not allowed to put a picture, sorry, so I put a link)
<html xmlns="http://www.w3.org/1999/xhtml">
I can find this code, but
xmlns:th="http://www.thymeleaf.org"
disappeared.
https://i.stack.imgur.com/pt5Nj.png
Related
I'm creating an Object in GET method and initialize it with nulls. Then I set some values and send it to the POST method, but after this process all of values that I set earlier are nulls. How could I repair it? I've tried to use hidden fields, but it didn't help.
HTML code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head>
<link rel="stylesheet" th:href="#{/styles.css}" />
</head>
<body>
<form method="POST" th:action="#{sendorder}" th:object="${details}">
<label for="name">Name: </label>
<input type="text" th:field="*{name}"/>
<br/>
<input type="hidden" th:field="*{order}" id="order"><label for="surname">Surname: </label>
<input type="text" th:field="*{surname}"/>
<br/><label for="room">Room: </label>
<input type="text" th:field="*{room}"/>
<br/>
<br/>
<h2>Please, choose your company:</h2>
<select th:field="*{company}">
<option th:each="i : ${companies}" th:value="${i.id}" th:text="${i.name}">
</option>
</select>
</div>
</div>
<input type="submit" value="Submit Order"/>
</form>
</body>
</html>
So I have started a spring boot project. The HTML loads fine, however, thyme-leaf seems to have trouble loading static files. The two files are in packages such as static.css and static.js. I get an ERR_ABORTED:404 error for loading both files and can not figure out why.
I have already tried changing the path (as suggested in other similar questions) to something like #{css/styles.css} instead of #{/css/styles.css} but that did not work.
Does anyone know if I'm missing something here?
Below is the HTML file:
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" th:href="#{/css/styles.css}">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<body>
<div class="bg-img">
<div class="content">
<header>Login Form</header>
<form action="#">
<div class="field">
<span class="fa fa-user"></span>
<input type="text" required placeholder="Email or Phone">
</div>
<div class="field space">
<span class="fa fa-lock"></span>
<input type="password" class="pass-key" required placeholder="Password">
<span class="show">SHOW</span>
</div>
<div class="pass">
Forgot Password?
</div>
<div class="field">
<input type="submit" value="LOGIN">
</div>
</form>
<div class="login">Or login with</div>
<div class="links">
<div class="facebook">
<i class="fab fa-facebook-f"><span>Facebook</span></i>
</div>
<div class="instagram">
<i class="fab fa-instagram"><span>Instagram</span></i>
</div>
</div>
<div class="signup">Don't have account?
Signup Now
</div>
</div>
</div>
<script type="text/javascript" th:src="#{/js/loginscript.js}"></script>
</body>
where is your css folder?
css, js should be in static folder
src
main
java
resources
static
css
i18n
img
js
templates
Add this in your head tag:
<link rel="stylesheet" href="../static/css/styles.css" type="text/css" th:href="#{/styles.css}">
Note: Above code will only work if styles.css present in below path:
|--resources
|--static
|--css
|--styles.css
This is here for anyone who finds this, it turns out for the th:href property, I had to give the full path as th:href="#{../static/css/styles.css}". Thanks to everyone who answered!
I'm unable to work out why i'm getting the 404, if i turn
BundleTable.EnableOptimizations = false;
then everything works OK, but set it to
BundleTable.EnableOptimizations = true;
then I get
Failed to load resource: the server responded with a status of 404
(Not Found)
I cannot work this out and it only happens for css, js bundle works ok any help appreciated.
I'm Using VS2015 and Umbraco 7.2.1
using System.Web.Optimization;
namespace Web.UI
{
public class BundleConfig
{
// For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
"~/Scripts/jquery.validate*"));
// Use the development version of Modernizr to develop with and learn from. Then, when you're
// ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
"~/Scripts/modernizr-*"));
bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
"~/Scripts/bootstrap.js",
"~/Scripts/bootstrap-datepicker.js",
"~/Scripts/respond.js"));
bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap.css",
"~/Content/font-awesome.min.css",
"~/Content/PagedList.css",
"~/Content/bootstrap-datepicker.css",
"~/Content/site.css"));
BundleTable.EnableOptimizations = true;
}
}
}
using System.Web.Optimization;
using Umbraco.Core;
namespace Web.UI
{
public class ApplicationEvents : ApplicationEventHandler
{
protected override void ApplicationStarted(UmbracoApplicationBase umbracoApplication, ApplicationContext applicationContext)
{
BundleConfig.RegisterBundles(BundleTable.Bundles);
}
}
}
<add key="umbracoReservedPaths" value="~/umbraco,~/install/,~/bundles/" />
#inherits UmbracoTemplatePage
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>#ViewBag.Title</title>
<meta name="description" content="#ViewBag.Description" />
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="container">
<div class="row">
<div class="col-lg-10" style="text-align: center">
<img src="../../Images/Sitelogo.png" alt="Logo" width="300" />
</div>
</div>
<div class="row">
<div id="custom-bootstrap-menu1" class="navbar navbar-default " role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="/"><i class="fa fa-home"> </i></a>
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-menubuilder">
<span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse navbar-menubuilder">
</div>
</div>
</div>
</div>
</div>
<div class="container bottomPadding">
#RenderBody()
</div>
<div class="container">
<div class="row">
<div class="col-lg-12">
<footer role="navigation">
<p>#Umbraco.RenderMacro("CopyrightDate")</p>
</footer>
</div>
</div>
</div>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/jqueryval")
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required: false)
#RenderSection("datepicker",false)
</body>
</html>
Namespace
<add namespace="System.Web.Optimization"/>
added to web.config in Views Folder
Found answer to my problem, the following link explains http://letswritecode.net/articles/using-the-umbraco-client-dependency-framework-to-bundle-and-minify/
For some weird reason, I cannot hit the controller that is registered to handle login posts. I just get redirected to this silly image that is in my resources folder:
https://localhost:8443/images/piggy-bank.jpeg
Here is my controller.
#RequestMapping(value = "/login/process", method = RequestMethod.POST)
public String loginPost(HttpSession session, Authentication authentication) {
String client_id = (String) session.getAttribute("client_id");
if (client_id.equals(Constants.TRUSTED_CLIENT)) {
//TODO:
/*
* 1. Generate an access_token
* 2. Save to database
* 3. Form redirect url with all necessary tokens
* 4. Return redirect url string
*/
return "redirect:" + Constants.REDIRECT_TRUSTED_CLIENT;
}
long userId = AuthenticationUtils.getAuthenticatedUserId(authentication);
return "/user/" + userId;
}
Here is my security configuration:
#Configuration
#EnableWebSecurity
public class SecurityConfiguration extends WebSecurityConfigurerAdapter {
#Autowired
#Qualifier("customUserDetailsService")
UserDetailsService userDetailsService;
#Autowired
public void configureGlobalSecurity(AuthenticationManagerBuilder auth) throws Exception {
auth.userDetailsService(userDetailsService);
}
#Override
protected void configure(HttpSecurity http) throws Exception {
http.
authorizeRequests()
.antMatchers("/","/sign_up","/resources/**").permitAll()
.anyRequest().authenticated()
.and()
.formLogin()
.permitAll()
.loginPage("/login")
.loginProcessingUrl("/login/process")
.defaultSuccessUrl("/")
.failureUrl("/access_denied")
.and()
.csrf()
.and()
.exceptionHandling()
.accessDeniedPage("/access_denied")
.and()
.logout()
.permitAll();
}
}
And here's the view:
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en">
<title>Spring App</title>
<!--/*/ <th:block th:include="fragments/headerinc :: head"></th:block> /*/-->
</head>
<body>
<div class="container">
<!--/*/ <th:block th:include="fragments/header :: header"></th:block> /*/-->
<div id="mainWrapper">
<div class="login-container">
<div class="login-card">
<div class="login-form">
<form th:action="#{/login/process}" method="post" class="form-horizontal">
<div th:if="${param.error != null}">
<div class="alert alert-danger">
<p>Invalid username and password.</p>
</div>
</div>
<div th:if="${param.logout != null}">
<div class="alert alert-success">
<p>You have been logged out successfully.</p>
</div>
</div>
<div class="input-group input-sm">
<label class="input-group-addon" for="username"><i class="fa fa-user"></i></label>
<input type="text" class="form-control" id="username" name="username" placeholder="Enter Username" />
</div>
<div class="input-group input-sm">
<label class="input-group-addon" for="password"><i class="fa fa-lock"></i></label>
<input type="password" class="form-control" id="password" name="password" placeholder="Enter Password" />
</div>
<input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}" />
<div class="form-actions">
<input type="submit"
class="btn btn-block btn-primary btn-default" value="Log in"/>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Inspecting my network data, I see that the form post to /login/process was successful and the server responded fine!
Request URL:https://localhost:8443/login/process
Request Method:POST
Status Code:302 Found
Remote Address:[::1]:8443
The log during spring startup also affirms the registration of url "/login/post" to the aforementioned controller. Corresponding log:
2016-04-21 20:44:30.725 INFO 25290 --- [ main] s.w.s.m.m.a.RequestMappingHandlerMapping : Mapped "{[/login/process],methods=[POST]}" onto public java.lang.String com.springapp.controllers.UserController.loginPost(javax.servlet.http.HttpSession,org.springframework.security.core.Authentication)
The situation may be something more insidious, because I can't seem to be redirected to even the defaultSuccessURL page, i.e. the index ("/"). The same is the case (i.e. loginProcessingURL and defaultSuccessfulURL not redirecting) exists even if I use the default out-of-box login view. Is there something wrong with my jsp view? Am I missing some security configuration?
However, manually entering /user/{id} OR any other url successfully lands me to the target url as long as I'm properly authenticated. What does that mean?
Finally here is the 'header.html' and 'headerinc.html' thymeleaf fragments which are inserted in all my jsp:
header.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<link href="../../static/css/app.css"
th:href="#{css/app.css}" rel="stylesheet" media="screen"/>
<link href="../../static/css/bootstrap.css"
th:href="#{css/bootstrap.css}" rel="stylesheet" media="screen"/>
<link href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/css/font-awesome.css"
th:href="#{/webjars/font-awesome/4.2.0/font-awesome.css}" rel="stylesheet" media="screen"/>
</head>
<body>
<div class="container">
<div th:fragment="header">
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#" th:href="#{/}">Home</a>
<ul class="nav navbar-nav">
<!-- if logged in, then display -logout, else display -login, -Sign up. -->
<div th:with="currentUser=${#httpServletRequest.userPrincipal?.name}">
<div th:if="${currentUser != null}">
<form th:action="#{/logout}" method="post">
<input type="submit" value="Log out"/>
</form>
</div>
<div th:if="${currentUser == null}">
<li>Log in</li>
<li>Sign up</li>
</div>
<!-- This is to simply test some authentication logic-->
All Users
</div>
</ul>
</div>
</div>
</nav>
<div class="jumbotron">
<div class="row text-center">
<div class="">
<h2>Spring Framework Example..</h2>
<h3>Spring Boot Web App</h3>
</div>
</div>
<div class="row text-center">
<img src="../../static/images/NewBannerBOOTS_2.png" width="400"
th:src="#{/images/piggy-bank.jpeg}"/>
</div>
</div>
</div>
</div>
</body>
</html>
headerinc.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en" th:fragment="head">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" media="screen" />
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="../static/css/guru.css"
th:href="#{/css/guru.css}" rel="stylesheet" media="screen"/>
</head>
<body>
</body>
</html>
This line:
.loginProcessingUrl("/login/process")
tells Spring Security to process the submitted credentials when sent the specified path and, by default, redirect user back to the page user came from. It will not pass the request to Spring MVC and your controller.
Maybe what you want instead of a request mapping is a custom AuthenticationSuccessHandler.
I had also the same issue very recently.
In my case, I had to add this code
<public void configure(WebSecurity web) throws Exception {
web.ignoring().antMatchers("/js/**","/assets/**", "/css/**");
}
Note:
Be careful not to use .anyRequest() here, like in
web.ignoring().antMatchers("/js/**","/assets/**", "/css/**").anyRequest()
Because that also gave me a lot of problems ...
I've got the following simple search page. 3 fields (one with fixed value) and submit button. When I click submit nothing happens at all. not even reload or anything. the button does nothing. Ignore the arabic in there, I have a feeling it got to do with arrangements of divs or placement of form_open.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>منزلي</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="<?php echo base_url();?>support/css/main.css" media="screen" />
</head>
<body>
<div id="header">
<div id="logo">
منزلي
</div>
<ul id="list-nav">
<li>للإتصال بنا </li>
<li>عن الموقع</li>
<li>منازل للبيع</li>
<li>منازل للإيجار</li>
<li>الرئيسية</li>
</ul>
</div>
<?
$this->load->helper('form');
form_open('search/search_properties'); ?>
<div id="center">
المدينة:
<select name="city">
<option>الخبر</option>
<option>الدمام</option>
<option>الظهران</option>
</select>
<br><br>
Type: <input type="text" value="flat" name="propertyType"/> <br><br>
حدود السعر:
<select name="range">
<option> <20000 </option>
<option>20000-30000</option>
<option>30000-40000</option>
<option>40000-50000</option>
<option> >500000 </option>
</select>
<br><br>
<input type="submit" value="بحث"/>
</form>
</div>
<div id="footer">
<p>2012 منزلي ©</p>
</div>
</body>
</html>
Any idea why this is happening?
thanks all for support
<?
$this->load->helper('form');
form_open('search/search_properties'); ?>
should be
<?
$this->load->helper('form');
echo form_open('search/search_properties'); ?>