项目前提:
在上一篇我们已经连接数据源成功,应用启动页成功了,下面我们在项目中添加一个页面试一下。
1:在web端(zh-web)的pom文件中添加页面渲染引擎依赖,我这边现在用的是freemarker。
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>
之后我们在web端(zh-web)的application.yml中配置freemarker的相关配置文件,具体内容如下:
spring:
freemarker:
suffix: .html
templateEncoding: UTF-8
templateLoaderPath: classpath:/templates/ #需要在web端(zh-web)的resource下建立templates文件夹
content-type: text/html
然后我们在web端(zh-web)端中写路由配置文件:
文件内容如图:
package com.zh.controller.common;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
/**
* created with IntelliJ IDEA
*
* @author: create by limu
* Date: 2020/11/13
* Time:15:27
*/
@Controller
public class MappingController {
/**
* 首页测试页面
*
* @return 解析地址
*/
@GetMapping("index")
public String index() {
return "index";
}
}
然后我们在启动,启动完成之后访问127.0.0.1:8080/index,结果如下图:
访问成功,我们查看浏览器控制台,可以看到我们引用js文件的地址是没有问题的,但是浏览器加载的时候状态成为404无法找到,
这时候我们需要知道,SpringBoot的静态文件是忽略static文件夹的,我们把静态资源地址改成下面这样就可以了:
<script src="/js/jquery.js"></script>
但是这样idea是无法引用的,会一直报黄色警告,而且我们查看js文件也不方便,一般前端静态页提交过来的也不方便,像这样我们可以配置一下静态资源地址,如图
在公共模块(zh-common)中添加配置类,文件内容如下:
package com.zh.config.web;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
/**
* created with IntelliJ IDEA
*
* @author: create by limu
* Date: 2020/11/13
* Time:16:02
*/
@Configuration
public class WebConfig implements WebMvcConfigurer {
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/static/**").addResourceLocations("classpath:/static/");
}
}
这样之后我们把地址改成前端给的地址再重启试一下,可以看到文件都被成功加载出来了吧,哈哈哈哈。
在下一篇中我们介绍一下多端的一个登录功能