How to ouput a json string in the js section of a html file using thymeleaf

Question

I have a project with Java 8, bringing data to the frontend with Thymeleaf. The data entity I want to ouput in my frontend is calles logs and is a list of entities that have an attribute containig json data. I output it in the html file as follows:

<script type="text/javascript">
    let logs = [[${logs}]];
</script>

The json has the following structure:

{
  "oldest": 712367620,
  "youngest": 712378606,
  "measurements": []
}

But on the page it appears with the double quotes escaped which completely messes up the js:

<script type="text/javascript">
    let logs = [LogEntity(id=52, success=true, runtimes={
        &quot;oldest&quot; : 712367620,
        &quot;youngest&quot; : 712378606,
        &quot;measurements&quot; : []
    })]
</script>

How can I prevent the escaping of the double quotes in the json string? I work with php and twig in another project and there it is as simple as {{ logs|raw }}. Is there some kind of modifier in thymeleaf like |raw in php twig?

Security is not an issue since I have complete control over the data objects.

Metroids · Accepted Answer · 2022-04-05 16:08:09Z

0

You have to enable JavaScript inlining with th:inline="javascript":

<script type="text/javascript" th:inline="javascript">
    let logs = [[${logs}]];
</script>

(I'm not sure what you mean by "json data". Do you mean you have a String that contains JSON?)

answered Apr 5, 2022 at 16:08

Metroids

20.6k4 gold badges49 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Mathias Bader Over a year ago

Exactly. The attribute runtimes is a string that contains json

Mathias Bader Over a year ago

Your code gives me

<script type="text/javascript"> 		let logs = "{\r\n  \"oldest\" : 752646765,\r\n  \"youngest\" : 752747578,\r\n  \"measurements\" : []\r\n}"; 	</script>

which I would need without the backslashes before the double quotes and without the \r\n

Mathias Bader Over a year ago

I found the solution here: stackoverflow.com/questions/29733594/…

Collectives™ on Stack Overflow

How to ouput a json string in the js section of a html file using thymeleaf

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related