vscode + springboot + HTML 搭建服务端(二)

简介: vscode + springboot + HTML 搭建服务端(二)

1. vscode环境搭建和工程创建请参考上一篇文章

vscode + springboot + HTML 搭建服务端(一)

2. 添加一个简单的展示

2.1 效果

2.2 代码

2.3 代码分解

  • 1: @RestController
  • 2: @RequestMapping(“/”)
  • url访问路径:localhost:8080/,浏览器中输入此url会调用其作用的函数hello()
  • 3: hello函数
  • 返回一个字符串,显示在浏览器中

3. 添加并展示HTML文件

上面只是在url中展示了一个字符串,而实际项目中是需要将一个网页展示出来,所以下面我们来添加一个HTML文件。

3.1 添加 html 文件

  • 在 src/main/resources/templates 路径下面添加 index.html 文件
  • index.html 文件代码:
<!DOCTYPE html>
<html>
  <head>
    <title>hello1111</title>
  </head>
  <body>
    <h1>index22222</h1>
  </body>
</html>

3.2 添加 url 访问路径

  • url 访问路径添加为: localhost:8080/index

3.3 运行程序,查看结果

3.3.1 很不幸的,遇到错误

org.thymeleaf.exceptions.TemplateInputException: Error resolving template…

3.3.2 解决过程
  1. 在运行程序后,会在工程目录下生成一个bin文件夹

  2. 发现 bin 文件夹和 src文件夹的结构比较相似
  3. 在报错的时候,发现在 src/main/resources/templates 文件夹下添加的 index.html 并没有在 bin/templates 文件夹下
  4. 死马当活马医,将 index.html 文件拷贝一份到 bin/templates 目录下

  5. 重新运行,打开网页,运行成功了…

3.3.3 总结
  • bin目录下应该是存放的执行文件,索引资源时也是在该路径下索引,所以在src/main/resources/templates 路径下的 html 文件可能索引不到 —> 猜的…
  • 为什么索引不到?是需要什么额外配置吗?

4. demo源码

package com.example.demo;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.servlet.ModelAndView;
@SpringBootApplication
@RestController
public class DemoApplication {
  @RequestMapping("/")
  public String hello()
  {
    return "Hello";
  }
  @RequestMapping("/index")
  public ModelAndView index()
  {
    ModelAndView modelView = new ModelAndView("index");
    return modelView;
  }
  public static void main(String[] args) {
    SpringApplication.run(DemoApplication.class, args);
  }
}

5. 后记

  • application.properties 文件一行没改,里面内容是空的
  • 修改监听端口,在application.properties文件里添加(这里修改的文件是在bin目录下的才会生效,修改src目录下的不会生效,也不知道为啥):
server.port=9000
相关文章
|
8天前
|
Java BI API
spring boot 整合 itextpdf 导出 PDF,写入大文本,写入HTML代码,分析当下导出PDF的几个工具
这篇文章介绍了如何在Spring Boot项目中整合iTextPDF库来导出PDF文件,包括写入大文本和HTML代码,并分析了几种常用的Java PDF导出工具。
94 0
spring boot 整合 itextpdf 导出 PDF,写入大文本,写入HTML代码,分析当下导出PDF的几个工具
|
28天前
|
JavaScript 前端开发 Java
SpringBoot项目的html页面使用axios进行get post请求
SpringBoot项目的html页面使用axios进行get post请求
35 6
|
4月前
|
前端开发 Java 开发工具
如何在Spring Boot框架下实现高效的Excel服务端导入导出?
ArtifactId:是项目的唯一标识符,在实际开发中一般对应项目的名称,就是项目根目录的名称。 Group Id,Artfact Id是保证项目唯一性的标识,一般来说如果项目打包上传至maven这样的包管理仓库中。在搜索你的项目时,Group Id,Artfact Id是必要的条件。 Version:版本号,默认0.0.1-SNAPSHOT。SNAPSHOT代表不稳定的版本,与之相对的有RELEASE。 Project type:工程的类型,maven工程还是gradle工程。 Language:语言(Java,Kotlin,Groovy)。
|
4月前
|
JavaScript
VScode格式化vue文件--避免html属性换行
VScode格式化vue文件--避免html属性换行
711 0
|
4月前
|
前端开发 安全 Java
家政系统(用户端)介绍Java18+前端html+后端springboot
家政系统(用户端)介绍Java18+前端html+后端springboot
45 0
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js的基于HTML5的问卷调查系统附带文章和源代码设计说明文档ppt
基于springboot+vue.js的基于HTML5的问卷调查系统附带文章和源代码设计说明文档ppt
46 0
|
8天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 实现动态路由和菜单功能,快速搭建前后端分离的应用框架
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 实现动态路由和菜单功能,快速搭建前后端分离的应用框架。首先,确保开发环境已安装必要的工具,然后创建并配置 Spring Boot 项目,包括添加依赖和配置 Spring Security。接着,创建后端 API 和前端项目,配置动态路由和菜单。最后,运行项目并分享实践心得,包括版本兼容性、安全性、性能调优等方面。
58 1
|
1月前
|
前端开发 JavaScript Java
基于Java+Springboot+Vue开发的服装商城管理系统
基于Java+Springboot+Vue开发的服装商城管理系统(前后端分离),这是一项为大学生课程设计作业而开发的项目。该系统旨在帮助大学生学习并掌握Java编程技能,同时锻炼他们的项目设计与开发能力。通过学习基于Java的服装商城管理系统项目,大学生可以在实践中学习和提升自己的能力,为以后的职业发展打下坚实基础。
99 2
基于Java+Springboot+Vue开发的服装商城管理系统
|
1月前
|
前端开发 JavaScript Java
SpringBoot项目部署打包好的React、Vue项目刷新报错404
本文讨论了在SpringBoot项目中部署React或Vue打包好的前端项目时,刷新页面导致404错误的问题,并提供了两种解决方案:一是在SpringBoot启动类中配置错误页面重定向到index.html,二是将前端路由改为hash模式以避免刷新问题。
140 1
|
9天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用
【10月更文挑战第8天】本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。首先,通过 Spring Initializr 创建并配置 Spring Boot 项目,实现后端 API 和安全配置。接着,使用 Ant Design Pro Vue 脚手架创建前端项目,配置动态路由和菜单,并创建相应的页面组件。最后,通过具体实践心得,分享了版本兼容性、安全性、性能调优等注意事项,帮助读者快速搭建高效且易维护的应用框架。
18 3