Spring Boot应用
框架Spring13 分钟 读完 (大约 1986 个字)  0次访问

Spring Boot应用

1、Restful风格简介

1.1 概念

一种软件架构风格、设计风格，而不是标准，只是提供了一组设计原则和约束条件。它主要用于客户端和服务器交互类的软件。基于这个风格设计的软件可以更简洁，更有层次，更易于实现缓存等机制。

1.2 URL定义

可以通过 GET、 POST、 PUT、 PATCH、 DELETE 等方式对服务端的资源进行操作。其中，GET 用于查询资源，POST 用于创建资源，PUT 用于更新服务端的资源的全部信息，PATCH 用于更新服务端的资源的部分信息，DELETE 用于删除服务端的资源。

1.3 API设计风格基本规则

  • 使用名词而不是动词
    • /getAllUsers
    • /updateUser
    • /deleteUser/001
  • 使用子资源表达关系（如果一个资源与另外一个资源有关系，使用子资源）
    • 返回所有用户GET：/getUser/
    • 返回001用户GET： /getUser/001

总而言之restful是一种旧技术新风格

2、RestfulCRUD

2.1 默认访问首页

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
@Configuration
public class SpringMVCConfig extends WebMvcConfigurerAdapter {
  //所有的WebMvcConfigurerAdapter组件都会一起起作用
  @Bean //将组件注册在容器
  public WebMvcConfigurerAdapter webMvcConfigurerAdapter(){
    WebMvcConfigurerAdapter adapter = new WebMvcConfigurerAdapter() {
      @Override
      public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/").setViewName("login");
        registry.addViewController("/index.html").setViewName("login");
      }
    };
    return adapter;
  }
}

2.2 国际化

  • 编写国际化配置文件；
  • 使用ResourceBundleMessageSource管理国际化资源文件
  • 在页面使用fmt:message（JSP）取出国际化内容

Spring Boot都自动配置好了，唯一要做的就是编写国际化配置文件了

步骤

  • 编写国际化配置文件，抽取页面需要显示的国际化消息

globalization

  • SpringBoot自动配置好了管理国际化资源文件的组件；

Ctrl+N搜索MessageSourceAutoConfiguration类，查看源码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
@Configuration
@ConditionalOnMissingBean(
  value = {MessageSource.class},
  search = SearchStrategy.CURRENT
)
@AutoConfigureOrder(-2147483648)
@Conditional({MessageSourceAutoConfiguration.ResourceBundleCondition.class})
@EnableConfigurationProperties
@ConfigurationProperties(
  prefix = "spring.messages"
)
public class MessageSourceAutoConfiguration {
  private static final Resource[] NO_RESOURCES = new Resource[0];
  private String basename = "messages"; //我们的配置文件可以直接放在类路径下叫messages.properties
  ...
  @Bean
  public MessageSource messageSource() {
    ResourceBundleMessageSource messageSource = new ResourceBundleMessageSource();
    if (StringUtils.hasText(this.basename)) {
      // 设置国际化资源文件的基础名（去掉语言国家代码的）
      messageSource.setBasenames(
        StringUtils.commaDelimitedListToStringArray(
          StringUtils.trimAllWhitespace(this.basename)
        )
      );
    }

    if (this.encoding != null) {
      messageSource.setDefaultEncoding(this.encoding.name());
    }

    messageSource.setFallbackToSystemLocale(this.fallbackToSystemLocale);
    messageSource.setCacheSeconds(this.cacheSeconds);
    messageSource.setAlwaysUseMessageFormat(this.alwaysUseMessageFormat);
    return messageSource;
  }
}
  • 去页面获取国际化的值；

Thymeleaf官方文档查看message

主配置文件：

1
2
3
4
#设置国际化资源路径
spring.messages.basename=i18n/login
#设置国际化编码格式
spring.messages.encoding=UTF-8

HTML文件：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<img class="mb-4" th:src="@{/asserts/img/bootstrap-solid.svg}"
  src="asserts/img/bootstrap-solid.svg" alt="" width="72" height="72">
<h1 class="h3 mb-3 font-weight-normal" th:text="#{login.tip}">Please sign in</h1>
<label class="sr-only" th:text="#{login.username}">Username</label>
<input type="text" class="form-control" placeholder="Username" 
  th:placeholder="#{login.username}" required="" autofocus="">
<label class="sr-only" th:text="#{login.password}">Password</label>
<input type="password" class="form-control" placeholder="Password"
  th:placeholder="#{login.password}" required="">
<div class="checkbox mb-3">
  <label>
    <input type="checkbox" value="remember-me"> [[#{login.rememberme}]]
  </label>
</div>
<button class="btn btn-lg btn-primary btn-block" type="submit" th:text="#{login.signin}">
  Sign in
</button>
<p class="mt-5 mb-3 text-muted">© 2017-2018</p>
<a class="btn btn-sm">中文</a>
<a class="btn btn-sm">English</a>

效果：根据浏览器语言设置的信息切换了国际化；

原理：国际化Locale（区域信息对象）；LocaleResolver（获取区域信息对象）；

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
@Bean
@ConditionalOnMissingBean
@ConditionalOnProperty(
  prefix = "spring.mvc",
  name = {"locale"}
)
public LocaleResolver localeResolver() {
  if (this.mvcProperties.getLocaleResolver() == 
    org.springframework.boot.autoconfigure.web.WebMvcProperties.LocaleResolver.FIXED) {
    
    return new FixedLocaleResolver(this.mvcProperties.getLocale());
  } else {
    AcceptHeaderLocaleResolver localeResolver = new AcceptHeaderLocaleResolver();
    localeResolver.setDefaultLocale(this.mvcProperties.getLocale());
    return localeResolver;
  }
}

默认的就是根据请求头带来的区域信息获取Locale进行国际化

  • 点击链接切换国际化

自定义组件MyLocaleResolver类

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
/**
 * 可以在连接上携带区域信息
 */
public class MyLocaleResolver implements LocaleResolver {

  @Override
  public Locale resolveLocale(HttpServletRequest httpServletRequest) {
    String l = httpServletRequest.getParameter("l");
    Locale locale = Locale.getDefault();
    // 是否携带语言信息
    if(!StringUtils.isEmpty(l)){
      String[] split = l.split("_");
      locale = new Locale(split[0],split[1]);
    }
    return locale;
  }

  @Override
  public void setLocale(HttpServletRequest httpServletRequest, 
    HttpServletResponse httpServletResponse, 
    Locale locale) {

  }
}

然后个组件添加进容器，在配置文件SpringMVCConfig类文件中：

1
2
3
4
5
// 区域信息解析器组件
@Bean
public LocaleResolver localeResolver(){
  return new MyLocaleResolver();
}

2.3 登录

开发期间模板引擎页面修改以后，要实时生效

  • 禁用模板引擎的缓存
1
2
# 禁用缓存
spring.thymeleaf.cache=false

  • 页面修改完成以后ctrl+F9：重新编译；

  • 登陆错误消息的显示

1
<p style="color: red" th:text="${msg}" th:if="${not #strings.isEmpty(msg)}"></p>

2.4 拦截器进行登陆检查

拦截器组件类：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
/**
 * 登陆检查，
 */
public class LoginHandlerInterceptor implements HandlerInterceptor {

  //目标方法执行之前
  @Override
  public boolean preHandle(HttpServletRequest httpServletRequest, 
    HttpServletResponse httpServletResponse, 
    Object o) throws Exception {

    Object user = httpServletRequest.getSession().getAttribute("loginUser");
    if(user == null){
      //未登陆，返回登陆页面
      httpServletRequest.setAttribute("msg","没有权限请先登陆");
      httpServletRequest.getRequestDispatcher("/index.html").forward(
        httpServletRequest, 
        httpServletResponse
      );

      return false;
    }else{
      //已登陆，放行请求
      return true;
    }
  }

  @Override
  public void postHandle(HttpServletRequest httpServletRequest, 
    HttpServletResponse httpServletResponse, 
    Object o, 
    ModelAndView modelAndView) throws Exception {

  }

  @Override
  public void afterCompletion(HttpServletRequest httpServletRequest, 
    HttpServletResponse httpServletResponse, 
    Object o, Exception e) throws Exception {

  }
}

注册拦截器

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
//所有的WebMvcConfigurerAdapter组件都会一起起作用
@Bean //将组件注册在容器
public WebMvcConfigurerAdapter webMvcConfigurerAdapter(){
  WebMvcConfigurerAdapter adapter = new WebMvcConfigurerAdapter() {
    ...
    // 注册拦截器
    @Override
    public void addInterceptors(InterceptorRegistry registry) {
      // super.addInterceptors(registry);
      // "/**"表示任意多层路径下的任意请求
      // 静态资源；  *.css , *.js
      // SpringBoot已经做好了静态资源映射
      registry.addInterceptor(new LoginHandlerInterceptor()).addPathPatterns("/**")
        .excludePathPatterns("/index.html", "/", "/login");
    }
  };
  return adapter;
}

3、CRUD-员工列表

3.1 RestfulCRUD：CRUD满足Rest风格；

URI： /资源名称/资源标识 HTTP请求方式区分对资源CRUD操作

普通CRUD（uri来区分操作） RestfulCRUD
查询 getEmp emp—-GET
添加 addEmp?xxx emp—-POST
修改 updateEmp?id=xxx&xxx=xx emp/{id}—-PUT
删除 deleteEmp?id=1 emp/{id}—-DELETE

3.2 thymeleaf公共页面元素抽取

1
2
3
4
5
6
7
8
9
10
11
12
13
14
1、抽取公共片段
<div th:fragment="copy">
&copy; 2011 The Good Thymes Virtual Grocery
</div>

2、引入公共片段
<div th:insert="~{footer :: copy}"></div>
~{templatename::selector}：模板名::选择器
~{templatename::fragmentname}:模板名::片段名

3、默认效果：
insert的公共片段在div标签中
如果使用th:insert等属性进行引入，可以不用写~{}：
行内写法可以加上：[[~{}]];[(~{})]；

三种引入公共片段的th属性：

th:insert：将公共片段整个插入到声明引入的元素中

th:replace：将声明引入的元素替换为公共片段

th:include：将被引入的片段的内容包含进这个标签中

页面示例：

1
2
3
<div th:fragment="copy">
  &copy; 2011 The Good Thymes Virtual Grocery
</div>

其他页面使用方式：

1
2
3
4
5
<div th:insert="footer :: copy"></div>

<div th:replace="footer :: copy"></div>

<div th:include="footer :: copy"></div>

效果：

1
2
3
4
5
6
7
8
9
10
11
<div>
  <footer>
    &copy; 2011 The Good Thymes Virtual Grocery
  </footer>
</div>
  <footer>
    &copy; 2011 The Good Thymes Virtual Grocery
  </footer>
<div>
  &copy; 2011 The Good Thymes Virtual Grocery
</div>

3.3 引入片段的时候传入参数：

父页面：

1
2
<!--引入侧边栏;传入参数-->
<div th:replace="commons/bar::#sidebar(activeUri='main.html')"></div>

子页面：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!-- sidebar -->
<nav class="col-md-2 d-none d-md-block bg-light sidebar" id="sidebar">
  <div class="sidebar-sticky">
    <ul class="nav flex-column">
      <li class="nav-item">
        <a class="nav-link active"
           th:class="${activeUri=='main.html'?'nav-link active':'nav-link'}"
           href="http://getbootstrap.com/docs/4.0/examples/dashboard/#"
           th:href="@{main.html}">
          <svg xmlns="http://www.w3.org/2000/svg" 
               width="24" height="24" 
               viewBox="0 0 24 24" 
               fill="none" 
               stroke="currentColor" 
               stroke-width="2" s
               troke-linecap="round" 
               stroke-linejoin="round" 
               class="feather feather-home">
            <path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path>
            <polyline points="9 22 9 12 15 12 15 22"></polyline>
          </svg>
          Dashboard <span class="sr-only">(current)</span>
        </a>
      </li>
      ...
    </ul>
  </div>
</nav>

3.4 添加操作

添加页面：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<form th:action="@{addEmployee}" method="post">
  <div class="form-group">
    <label>LastName</label>
    <input name="lastName" type="text" class="form-control" placeholder="name">
  </div>
  <div class="form-group">
    <label>Email</label>
    <input name="email" type="email" class="form-control" placeholder="name@163.com">
  </div>
  <div class="form-group">
    <label>Gender</label><br/>
    <div class="form-check form-check-inline">
      <input class="form-check-input" type="radio" name="gender"  value="1">
      <label class="form-check-label">男</label>
    </div>
    <div class="form-check form-check-inline">
      <input class="form-check-input" type="radio" name="gender"  value="0">
      <label class="form-check-label">女</label>
    </div>
  </div>
  <div class="form-group">
    <label>department</label>
    <select class="form-control" name="department.id">
      <!-- 提交的是部门的id -->
      <option th:value="${dept.id}" th:each="dept: ${departments}" 
        th:text="${dept.departmentName}">
        1
      </option>
    </select>
  </div>
  <div class="form-group">
    <label>Birth</label>
    <input name="birth" type="text" class="form-control" placeholder="2020/01/01">
  </div>
  <button type="submit" class="btn btn-primary">添加</button>
</form>

提交的数据格式不对：生日：日期；

2017-12-12；2017/12/12；2017.12.12；

日期的格式化；SpringMVC将页面提交的值需要转换为指定的类型;

2017-12-12—-Date； 类型转换，格式化;

默认日期是按照/的方式；

3.5 修改操作

修改添加二合一表单

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<!-- 需要区分员工修改还是添加 -->
<form th:action="${employee!=null}?@{updateEmployee}:@{addEmployee}" method="post">
  <!-- 发送put请求修改原数据 -->
  <!--
    1、SpringMVC中配置HiddenHttpMethodFilter;（SpringBoot自动配置好的）
    2、页面创建一个post表单
    3、创建一个input项，name="_method";值就是我们指定的请求方式
  -->
  <!-- th:if="${employee!=null}"修改页面采用put方式 -->
  <input type="hidden" name="_method" value="put" th:if="${employee!=null}"/>
  <input type="hidden" name="id" th:if="${employee!=null}" th:value="${employee.id}">
  <div class="form-group">
    <label>LastName</label>
    <input name="lastName" type="text" class="form-control" placeholder="name" 
      th:value="${employee!=null}?${employee.lastName}">
  </div>
  <div class="form-group">
    <label>Email</label>
    <input name="email" type="email" class="form-control" placeholder="name@163.com" 
      th:value="${employee!=null}?${employee.email}">
  </div>
  <div class="form-group">
    <label>Gender</label><br/>
    <div class="form-check form-check-inline">
      <input class="form-check-input" type="radio" name="gender"  value="1" 
        th:checked="${employee!=null}?${employee.gender}==1">
      <label class="form-check-label">男</label>
    </div>
    <div class="form-check form-check-inline">
      <input class="form-check-input" type="radio" name="gender"  value="0" 
        th:checked="${employee!=null}?${employee.gender}==0">
      <label class="form-check-label">女</label>
    </div>
  </div>
  <div class="form-group">
    <label>department</label>
    <select class="form-control" name="department.id">
      <!-- 提交的是部门的id -->
      <option th:selected="${employee!=null}?${dept.id == employee.department.id}" 
        th:value="${dept.id}" th:each="dept: ${departments}" 
        th:text="${dept.departmentName}">1</option>
    </select>
  </div>
  <div class="form-group">
    <label>Birth</label>
    <input name="birth" type="text" class="form-control" placeholder="2020/01/01" 
      th:value="${employee!=null}?${#dates.format(employee.birth, 'yyyy-MM-dd HH:mm')}">
  </div>
  <button type="submit" class="btn btn-primary" th:text="${employee!=null}?'修改':'添加'">
  </button>
</form>

3.6 删除操作

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
  <h2><a class="btn btn-sm btn-success" th:href="@{addEmployeePage}">添加员工</a></h2>
  <div class="table-responsive">
    <table class="table table-striped table-sm">
      ...
      <tbody>
        <tr th:each="emp: ${employees}">
          <td th:text="${emp.id}"></td>
          <td>[[${emp.lastName}]]</td>
          <td th:text="${emp.email}"></td>
          <td th:text="${emp.gender}==0?'女':'男'"></td>
          <td th:text="${emp.department.departmentName}"></td>
          <td th:text="${#dates.format(emp.birth, 'yyyy-MM-dd HH:mm')}"></td>
          <td>
            <a class="btn btn-sm btn-primary" th:href="@{/employee/}+${emp.id}">编辑</a>
            <!-- <form th:action="@{/employee/}+${emp.id}" method="post">-->
            <!--   <input type="hidden" name="_method" value="delete"/>-->
            <!--   <button type="submit" class="btn btn-sm btn-danger">删除</button>-->
            <!-- </form>-->
            <!-- th:attr自定义标签属性 -->
            <button th:attr="del_uri=@{/employee/}+${emp.id}" 
              class="btn btn-sm btn-danger deleteBtn">
              删除
            </button>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</main>
<!-- 将表单放在里面，每个删除按钮就会有个表单，放在外面简洁 -->
<form id="deleteEmpForm" method="post">
  <input type="hidden" name="_method" value="delete"/>
</form>

<script>
  $(".deleteBtn").click(function(){
    //删除当前员工的
    $("#deleteEmpForm").attr("action",$(this).attr("del_uri")).submit();
    return false;
  });
</script>
#

喜欢这篇文章？打赏一下作者吧

评论

关注我

链接

分类

标签

English1
主题1
前端1
原理4
基类1
复试1
搜索引擎1
数据库1
校招2
框架12
积累2
算法18
考研1
计算机基础7
课程5
配置7
面试题集2

订阅更新

×