SpringBoot(7) integrate themeleaf+bootstrap

preface

Thymeleaf is a modern server-side Java templating engine for Web and standalone environments. Thymeleaf’s main goal is to bring elegant natural templates to your development workflow — HTML that displays correctly in a browser and can be used as a static prototype for greater collaboration among development teams. Thymeleaf can handle HTML, XML, JavaScript, CSS, and even plain text.

Spring-boot-starter-web integrates Tomcat with Spring MVC to automatically configure things, and Thymeleaf is the most widely used templating engine.

Update the pom. XML

#thymeleaf

spring.thymeleaf.cache=false

spring.thymeleaf.prefix=classpath:/templates/

spring.thymeleaf.check-template-location=true

spring.thymeleaf.suffix=.html

spring.thymeleaf.encoding=UTF-8

spring.thymeleaf.mode=HTML5

Create a Controller

The reason for creating a new Controller instead of reusing the previous IndexController is that IndexController uses the @RestController annotation.

1. With the @Controller annotation, the view parser can parse the RETURN JSP, HTML page, and jump to the corresponding page in the corresponding method. If you return something like JSON to the page, you need to annotate @responseBody

2. So the @restController annotation, which is kind of like the @Controller and @responseBody annotation combined, returns json data without having to put the @responseBody annotation in front of the method, but with the @RestController annotation, You can’t return a JSP HTML page, and the view parser can’t parse a JSP HTML page

New UserController:

package com.demo.controller;

import com.demo.pojo.UserPosition;

import com.demo.service.UserService;

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.stereotype.Controller;

import org.springframework.ui.Model;

import org.springframework.web.bind.annotation.RequestMapping;

import java.math.BigDecimal;

import java.util.List;

/ * *

• Created by toutou on 2018/10/20.

* /

@Controller

public class UserController {

@Autowired

UserService userService;

@RequestMapping(value = “/mynearby”)

public String myNearby(Model model, double lon, double lat)

{

double r = 6371; // The radius of the earth is km

double dis = 2; // Radius unit :km

double dlng = 2Math.asin(Math.sin(dis/(2r))/Math.cos(lat*Math.PI/180));

dlng = dlng*180/Math.PI; // The Angle changes to radians

double dlat = dis/r;

dlat = dlat*180/Math.PI;

double minlat =lat-dlat;

double maxlat = lat+dlat;

double minlng = lon -dlng;

double maxlng = lon + dlng;

List list = userService.getVicinity(BigDecimal.valueOf(minlng), BigDecimal.valueOf(maxlng), BigDecimal.valueOf(minlat), BigDecimal.valueOf(maxlat));

model.addAttribute(“myinfo”,list);

return “mynearby”;

}

}

Create the page

/src/main/resources/templates/mynearby.html

XMLNS :th=”www.thymeleaf.org” namespace to convert shots to dynamic views. Elements that need dynamic processing are prefixed with “th:”; The two links import the Bootstrap framework, which uses @{} to import web static resources (resource paths in parentheses) to access data in the model via ${}.

Operation effect:

Directory structure: