We're using JTwig templating engine in our Spring webapp. It's great tool and has really nice features, but we have hit a wall with unicode content encoding using UTF-8.
First of all, ViewResolver is configured in Java with:
#Bean
public ViewResolver viewResolver() {
JtwigViewResolver view = new JtwigViewResolver()
view.setPrefix("/WEB-INF/templates/");
view.setSuffix(".twig");
return view;
}
then we have Spring MVC controller adding some text to model and passing it to view:
#RequestMapping(value = "/unicode", produces = "text/html;charset=UTF-8")
public String testUnicode(ModelMap model) {
model.addAttribute("text", "tête de bou 간편한 설치 및 사용");
return "testPage";
}
where it's finally rendered:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
</head>
<body>
<h1>tête de bouton -- 간편한 설치 및 사용</h1>
From model: {{ text }}
</body>
</html>
but the output is actually:
tête de bouton -- 간편한 설�? 및 사용
From model: t?te de bou ??? ?? ? ??
Unicode text hardcoded in template i almost right, but the one from model is totally screwed. Any ideas?
Jtwig uses Java's default charset when rendering. This violates Twig compatibility, as Twig defaults to UTF-8.
I wrote a patch for the issue which was released in 3.1.0.
You can do the following:
1) view.setEncoding("UTF-8");
2) view.setContentType("text/html; charset=UTF-8");
The second
Related
I'm using the Mustache engine and I have this controller method:
#Controller
public class BetController {
#GetMapping("/bet")
public String show (Model model/*, #RequestParam long id*/){
//Bet bet = this.service.get(id);
return "bet_page"; //returns directly the template
}
}
Which it should return a view with a template called "bet_page":
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Apuestas</title>
</head>
<body>
<h1>Tus apuestas</h1>
<div id="navbar"></div>
<h2>Apuestas realizadas</h2>
{{bets}}
<h2>Próximos partidos</h2>
{{games}}
<div id="match"></div>
<script src="/static/assets/js/jquery.min.js"></script>
<script src="/static/assets/js/navbar.js"></script>
</body>
</html>
However, looks like Spring can't see the template, and IntelliJ throws this warning:
[![image showing warning: cannot resolve MVC view][1]][1]
I look into internet some solutions and none of these helped me to solve the problem.
By the way, here's the configuration that I use and the directory structure:
spring.mustache.suffix="html"
spring.mustache.prefix=classpath:/templates/
#ACCESS INFO
spring.datasource.url=jdbc:mysql://localhost/quidditch\
?useUnicode=true\
&useJDBCCompliantTimezoneShift=true\
&useLegacyDatetimeCode=false\
&serverTimezone=UTC
spring.datasource.username=root
spring.datasource.password=root
#DATABASE PROPERTIES
spring.datasource.driverClassName=com.mysql.cj.jdbc.Driver
spring.jpa.hibernate.ddl-auto= create-drop
[![Directory structure of my project][2]][2]
Any guesses?
EDIT: Looks like something from SQL is affecting in loading the templates (I'm using MySQL with JPA an JDBC)
[1]: https://i.stack.imgur.com/c3fFm.png
[2]: https://i.stack.imgur.com/vzmMv.png
I'm trying to convert a blade file to PDF format.
I've used barryvhd/laravel-dompdf to convert to PDF but DOMPdf doesn't support Japanese font, all Japanese character display to ? character.
My php code:
$pdf = PDF::loadView('pdf/presaleorder', ['order' => $order]);
$pdf->save('test.pdf');
My blade file:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>画像</title>
</head>
<body>
<div>
<p>
ァ ア ィ イ ゥ ウ ェ エ ォ オ カ ガ キ ギ ク
グ ケ ゲ コ ゴ サ ザ シ ジ ス ズ セ ゼ ソ ゾ タ
ダ チ ヂ ッ ツ ヅ テ デ ト ド ナ ニ ヌ ネ ノ ハ
バ パ ヒ ビ ピ フ ブ プ ヘ ベ ペ ホ ボ ポ マ ミ
ム メ モ ャ ヤ ュ ユ ョ ヨ ラ リ ル レ ロ ヮ ワ
ヰ ヱ ヲ ン ヴ ヵ ヶ ヷ ヸ ヹ ヺ ・ ー ヽ ヾ ヿ
</p>
</div>
</body>
</body>
</html>
However, I found a post solved this. I've added <style> in header
<style>
#import url('https://fonts.googleapis.com/css?family=Roboto');
body {
font-family: 'Roboto', sans-serif;
}
</style>
Now, all character display like this:
But when I copied text in pdf file, I got this
ァ ア ィ イ ゥ ウ ェ エ ォ オ カ ガ キ ギ ク グ ケ ゲ コ ゴ サ ザ シ ジ ス ズ セ ゼ ソ ゾ タ ダ チ ヂ
I wonder, it's because of barryvhd/laravel-dompdf or PDF Reader cause this. I'm using Adobe Acrobat Reader DC version 2020.012.20043 and installed font-pack.
Anyone has solution?
Character sets
You need to define the character set in the meta tag in the HTML document.
<meta charset="UTF-8" />
Finally, I can solve this problem. It's because Roboto font does not support for Japanese. Instead use fonts which support Japanese. I've tried MS Mincho, Hiragano Sans and it worked.
A note that dompdf only support for font with format .ttf, so other format will not work.
I have a controller that create model attribute and passes to the view "partial.html" to generate output
partial.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Home page</title>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<p>
<span th:text="'Today is: ' + ${message}"></span>
</p>
</body>
</html>
and inside a controller method
model.addAttribute("message", search);
How to do I get Htlm Output to a string inside controller method?
like this
String htmlOutput="from partial.html";
Let's say you have a HTML file with two variable name and todayDate.
You want to process it and want to store it in a string / database / AWS S3.
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
</head>
<body>
<p>Hello</p>
<p th:text="${name}"></p>
<p th:text="${todayDate}"></p>
</body>
</html>
Your HTML file location is src/main/resources/templates/home.html
By using the below function you can get the final processed HTML as:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<p>Hello</p>
<p>Manoj</p>
<p>30 November 2019</p>
</body>
</html>
import org.thymeleaf.context.Context;
#GetMapping("/")
public void process() {
SpringTemplateEngine templateEngine = new SpringTemplateEngine();
ClassLoaderTemplateResolver templateResolver = new ClassLoaderTemplateResolver();
templateResolver.setPrefix("templates/");
templateResolver.setCacheable(false);
templateResolver.setSuffix(".html");
templateResolver.setTemplateMode("HTML");
// https://github.com/thymeleaf/thymeleaf/issues/606
templateResolver.setForceTemplateMode(true);
templateEngine.setTemplateResolver(templateResolver);
Context ctx = new Context();
SimpleDateFormat dateFormat = new SimpleDateFormat("dd MMMM yyyy");
Calendar cal = Calendar.getInstance();
ctx.setVariable("todayDate", dateFormat.format(cal.getTime()));
ctx.setVariable("name", "Manoj");
final String result = templateEngine.process("home", ctx);
System.out.println("result:" + result);
}
If you're using the usual Spring MVC approach, as Joanna says you're doing things in the wrong order. The Controller creates the model and specifies the view, and then after that the view is rendered by the Thymeleaf template that uses the model.
If, on the other hand, you're trying to render Thymeleaf templates yourself (rather than sending them to the user's browser directly, maybe for use in HTML email or to store prerendered pages in a database or something), then you'd need to create your own Thymeleaf Template Engine to use. Refer to the "Creating and configuring the Template Engine" section of the documentation for details. You can create your own Engine, and then use its process method to get the result of the template to put into a variable for further use.
You may looking for this, getting directly the result HTML, just ignore the email part of the post.
Then, you can create this:
final Context ctx = new Context(locale);
ctx.setVariable("name", recipientName);
ctx.setVariable("subscriptionDate", new Date());
ctx.setVariable("hobbies", Arrays.asList("Cinema", "Sports", "Music"));
ctx.setVariable("imageResourceName", imageResourceName);
// so that we can reference it from HTML
final String htmlContent = this.templateEngine.process("html/email-inlineimage.html", ctx);
So you have the htmlContext of rendered thymeleaf template (with vars)
Once the control goes out to view processor (JSP/Thymeleaf etc), it will not be coming back to controller. You will be able to get the raw html response in a customFilter, but not in the Controller.
I am using Laravel 5.5 and Dusk 2.0. I have the following html.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body class="my-body-class" id="my-body-div">
<div class="my-content-class" id="my-content-div">
Content goes here.
</div>
</body>
</html>
Here's my Dusk test.
public function testBasicExample()
{
$this->browse(function (Browser $browser) {
$browser->visit('/test/admin-fixed-layout');
$this->assertNotNull($browser->element('.my-content-class'));
$this->assertNotNull($browser->element('#my-content-div'));
// $this->assertNotNull($browser->element('.my-body-class'));
$this->assertNotNull($browser->element('#my-body-div'));
});
}
If I un-comment the assertion that uses the body class selector, the test fails. Why?
This is because by default prefix is set to body:
public function __construct($driver, $prefix = 'body')
{
$this->driver = $driver;
$this->prefix = trim($prefix);
}
in Laravel\Dusk\ElementResolver class.
If you really need to change this (but probably there is no point), you can add the following method into Tests/DuskTestCase class:
protected function newBrowser($driver)
{
return new \Laravel\Dusk\Browser($driver, new \Laravel\Dusk\ElementResolver($driver, ''));
}
This will override default browser and pass empty prefix instead of default body prefix
Reading through the Grails docs (see here http://grails.org/doc/latest/guide/theWebLayer.html#ajax), I was led to believe that I could use Ajax to update a div using the following syntax:
My view (Ajax/index.gsp)
<!doctype html>
<head>
<meta name="layout" content="main"/>
</head>
<body>
<div id="error"></div>
<div id="message"></div>
<g:remoteLink action="retrievePets" update="message">Ajax magic... Click here</g:remoteLink>
</body>
</html>
My controller (AjaxController):
package genericsite
class AjaxController {
def index() { }
def retrieveMessage() {
render "Weeee! Ajax!"
}
}
However, when I select the link, it just sends me to a page with "Weeee! Ajax!" I know how to do this the typical jQuery way. This is slightly more convenient...
The default "main" layout doesn't include a javascript library by default, so if you want to use remoteLink or any of its associates you'll need to add
<r:require module="jquery"/>
or (if you're on a pre-2.0 version of Grails or not using the resources plugin)
<g:javascript library="jquery"/>
to the <head> section of your GSP.