本文共 11631 字,大约阅读时间需要 38 分钟。
链接:https://pan.baidu.com/s/13CPPHGnw-jkxJcMlleU9vw
提取码:twru
这里我们只是实现了一个功能那就是访问:localhost:8088可以访问到登陆页面
注意我们的登录页面,但是是英文,我们接下来需要做的就是根据浏览器的优先语言来自动变换语言以及在点击最下面的中英文链接的实现中英文转化功能也实现,一共是两个功能。
我们首先在resources
目录下建立文件: 现在我们还需要一个英文的配置文件,创建方式可以按照下面来,命名方式与中文的一样,都是语言名加上国家代号(也可以直接新建
) 接下来我们就在那个中文的配置文件中完成英文的转换: 红框的内容就是我们需要转换的内容 这里我举例翻译提示部分(下面注意选择了文件后在左下角选择Resource Bondle
)。 其他按照上面修改即可。 最后应该是这样: index.properties
: index.password=密码~
index.remember=记住我~ index.sign=登陆~ index.tip=请登录~ index.username=姓名~
index_zh_CN.properties:
index.password=密码
index.remember=记住我 index.sign=登陆 index.tip=请登录 index.username=姓名
index_en_US.properties
:
index.password=Password
index.remember=Remember me index.sign=Sign in index.tip=Please sign in index.username=Username
这一部分我们只是了解,本文的目的在于应用,原理我们不深挖,想了解原理的同学请自行看下面的文件
接下来我们需要在主配置文件里面加上:spring.messages.basename=i18n.index
至于为什么这么做想知道原理的同学可以看我上看给出的文件的源码去了解。
我们现在可以把index.html
的内容改为如下:
登录
注意上面的sr
c和href
一定要修改为我们的thymeleaf
表达式,不然后面页面跳转是会出问题。举个例子,现在发送一个请求localhost:8088/user/login
,于是来到登录的页面,密码输入错误重新转发回到登录页面,但是由于我们没有使用thymeleaf的表达式,最后导致了例如src="asserts/img/bootstrap-solid.svg"
就会解析为localhost:8088/user/asserts/img/bootstrap-solid.svg"
,相当于往前退一个,把login
少了,然后user
保留了,而正确的路径应该是:localhost:8088/asserts/img/bootstrap-solid.svg"
。
接下来再次访问发现得到这样的结果:
解决方案就是在MyConfig
类中加入: @Beanpublic ResourceBundleMessageSource messageSource(){ ResourceBundleMessageSource messageSource = new ResourceBundleMessageSource(); messageSource.setUseCodeAsDefaultMessage(true); messageSource.setFallbackToSystemLocale(false); messageSource.setBasenames("i18n.index"); messageSource.setDefaultEncoding("UTF-8"); messageSource.setCacheSeconds(2); return messageSource;}
再次访问:
当然也许有的同学会遇到乱码的现象,这里解决方案是在Setting
里面配置File Encoding
为UTF-8
即可(当然这个时候需要把我们的国际化配置文件的内容修正回来,因为这个时候已经乱码了
) 解决了上述问题后,我们再来回一下我们最开始说的要实现根据浏览器默认的语言优先级来显示对应的语言(注意这不是使用浏览器的翻译功能
),这里我们来详细的演示一边就明白了: 演示1:中文优先
访问如下: 演示2:英文优先
访问如下: 不过这里呢我们还是简单的来介绍一下我们的原理: 在英文优先的条件下的请求头信息如下: 现在我们来实现第二个功能,就是点击链接实现中英文的转化: 首先需要修改index.html
里面的链接标签,如下: 但是这样还是不能实现我们的功能,因为在容器里面的区域信息解析器还是更根据我们的请求头来的,我们需要在容器中加入我们自己的区域信息解析器才行。 我们兴建下面一个区域信息解析器: package com.jack.demo.component;import org.springframework.util.StringUtils;import org.springframework.web.servlet.LocaleResolver;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import java.util.Locale;public class MyLocaleResolver implements LocaleResolver { @Override public Locale resolveLocale(HttpServletRequest request) { String lang = request.getParameter("l"); //操作系统自己的区域化对象 Locale locale = Locale.getDefault(); if(!StringUtils.isEmpty(lang)){ String[] split = lang.split("_"); locale = new Locale(split[0],split[1]); } return locale; } @Override public void setLocale(HttpServletRequest request, HttpServletResponse response, Locale locale) { }}
然后我们在MyConfig类
里面加上:
@Bean//注意这个方法名应该为localeResolver,因为最后需要根据这个名字来获取组件//或者在@Bean注解上来加名字也可public LocaleResolver localeResolver(HttpServletRequest request){ return new MyLocaleResolver();}到这里我们的国际化配置的内容就讲解完毕。
首先我们把index.html
的表单标签来修改一下属性:
<form class=“form-signin” action=“dashboard.html” th:action="@{/user/login}" method=“post”>
接下来我们编写Controller
:
package com.jack.demo.controller;import org.springframework.stereotype.Controller;import org.springframework.web.bind.annotation.PostMapping;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RequestMethod;@Controllerpublic class LoginController { @PostMapping("/user/login") //@RequestMapping(value = "/user/login",method = RequestMethod.POST) public String login(){ return "dashboard"; }}
插句题外话:这里说一个小技巧,在我们以后的开发中会反复的修改我们的页面,但是这样我们就要不断的重启我们的应用,这样带来的结果就是很浪费开销,我们可以这么做,在主配置文件中我们加上spring.thymeleaf.cache=false来禁用缓存,然后按住ctrl+f9即可完成自动重新编译(热部署)
为了让密码错误时显示msg
消息,我们加入下面标签:
修改或者添加红框的内容
): 演示如下: 不过这样我们又有了一个新的问题就是如果直接访问:http://localhost:8088/main.html
也可得到上面的页面,这显然不对的,于是我们可以通过配置拦截器来解决。(后面会出教程使用Spring-Security
来实现),如果对拦截器的知识忘记了可以参考我的SpringMVC教程
: 我们编写拦截器: package com.jack.demo.component;import org.springframework.web.servlet.HandlerInterceptor;import org.springframework.web.servlet.ModelAndView;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import javax.servlet.http.HttpSession;public class LoginHandlerInterceptor implements HandlerInterceptor { @Override public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception { HttpSession session = request.getSession(); Object user = session.getAttribute("loginUser"); //如果没有user这一属性,说明没有登录成功过 if(user==null){ //无法通过那么我们需要的操作就是跳转到登陆界面 request.getRequestDispatcher("/index.html").forward(request,response); request.setAttribute("msg","无权访问"); return false;//拦截 }else{ return true; } } @Override public void postHandle(HttpServletRequest request, HttpServletResponse response, Object handler, ModelAndView modelAndView) throws Exception { } @Override public void afterCompletion(HttpServletRequest request, HttpServletResponse response, Object handler, Exception ex) throws Exception { }}
然后将拦截器注入到容器中:
(注意如果出现上面拦截失效的话,加上"/error"即可)
登录成功后我们要在session
中说明该用户已登录: 演示如下: 当我们直接访问main.html
时我们发现跳转到了登录页面,登录成功后我们再次开一个新的页面时再次直接访问main.html
就可以直接成功了。不过我们还要一个问题就是我们登录后Company Name
应该是jack
才对,很简单: 在dashboard.html显示Company Name的那一个标签内加上下面内容
th:text="${#session.getAttribute(‘loginUser’)}
RestFul风格的CRUD的URI是/资源名称/资源标识
,他通过请求方式来区分操作
操作类型 | 普通CRUD(以路径区分操作) | RestFul的CRUD(以请求方式来区分操作) |
---|---|---|
查询 | getEmp/… | emp–GET方式 |
添加 | addEmp/… | emp–POST方式 |
修改 | updateEmp/… | emp–PUT方式 |
删除 | deleteEmp/… | emp–DELETE方式 |
现在我们列举本实验的具体路径:
在这里我先将list.html
放到templates
下面的emp
包下面
package com.jack.demo.controller;import com.jack.demo.dao.EmployeeDao;import com.jack.demo.entities.Employee;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.stereotype.Controller;import org.springframework.ui.Model;import org.springframework.web.bind.annotation.GetMapping;import java.util.Collection;@Controllerpublic class EmployeeController { @Autowired EmployeeDao employeeDao; //返回员工列表页面 @GetMapping("/emps") public String list(Model model){ Collectionemployees = employeeDao.getAll(); model.addAttribute("emps",employees); return "/emp/list"; }}
然后把dashboard.html
做如下修改:
list.html
做如下修改: 接下来演示一下: 接下来我们要解决一个冗余的问题,就是下面红框的部分每个页面是一样的因此我们应该把这一部分抽取出来。
这里给出一个我写的一个的文章给大家参考即可。具体的操作留给读者。 这里我将公共部分抽取出来放在templates/emp/bar.html里面如下:bar
下面这样处理后在访问dashboard.html
时activeUri
的值就是main.html
,在访问
list.html
时activeUri
的值就是emps
在bar.html
里面就根据这些值来判断是否高亮显示。 在list.html
修改显示内容如下:
编号 | 姓名 | 邮箱 | 性别 | 部门 | 生日 |
---|---|---|---|---|---|
[[${emp.department.departmentName}]] |
CRUD
做准备我们作如下修改: 效果如下: 对list.html
做如下修改:
EmployeeController
里添加下面内容: @AutowiredDepartmentDao departmentDao;@GetMapping("/emp")public String toAddPage(Model model){ Collectiondepartments = departmentDao.getDepartments(); model.addAttribute("depts",departments); return "emp/add";}@PostMapping("/emp")public String add(Employee employee){ employeeDao.save(employee); return "redirect:/emps";}
templates/emp/add.html
的内容如下:
上面演示正常了,但对于添加功能我们会存在下面问题:Dashboard Template for Bootstrap
提交的数据格式不对:生日:日期;
2017-12-12;2017/12/12;2017.12.12; 日期的格式化;SpringMVC将页面提交的值需要转换为指定的类型; 2017-12-12—Date; 类型转换,格式化; 默认日期是按照/的方式;
我们可以在主配置文件指定日期提交的格式:
spring.mvc.date-format=yyyy-MM-dd HH:mm
在EmployeeController
里面加上:
@GetMapping("/emp/{id}")public String toEditPage(@PathVariable("id") Integer id,Model model){ Employee employee = employeeDao.get(id); Collectiondepartments = departmentDao.getDepartments(); model.addAttribute("depts",departments); model.addAttribute("emp",employee); return "emp/edit";}
而我们的templates/emp/edit.html
为:
Dashboard Template for Bootstrap
这里表单实现了put
方式的提交。
1.SpringMvc配置了HiddenHttpMethodFilter(SpringBoot自动配置好了)
2.创建表单,提交方式为post 3.在表单里面加上input标签,name为_method;value为put
效果展示:
对list.html
作如下修改
$(".btnDelete").click(function () { $("#deleteEmpForm").attr("action",$(this).attr("deleteUri")).submit()})
演示如下:
到此我们的整个教程就此结束了,如果您认为对您有用麻烦为我点个赞哈!转载地址:http://illzi.baihongyu.com/