SpringBoot启动后,无法访问index.html

今天写代码,发现SpringBoot项目运行之后,就是找不到index.html,编写了Config配置类也不行,最后在网上去查找,发现都是以前的版本的方法。

目前使用的是

# 参数是String[],可以指定多个
spring:
  web:
    resources:
      static-locations: classpath:/templates/,classpath:/static/
  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
【资源说明】 1、基于SpringBoot+Vue开发一个前后端分离的书籍分享管理系统源码+项目说明.zip 2、该资源包括项目的全部源码,下载可以直接使用! 3、本项目适合作为计算机、数学、电子信息等专业的课程设计、期末大作业和毕设项目,作为参考资料学习借鉴。 4、本资源作为“参考资料”如果需要实现其他功能,需要能看懂代码,并且热爱钻研,自行调试。 基于SpringBoot+Vue开发一个前后端分离的书籍分享管理系统源码+项目说明.zip ## 快速部署 1. 数据库脚本使用 Flyway 管理,**不需要手动导入数据库脚本**,只需要提前在本地 MySQL 中创建一个空的数据库 ,并修改项目中关于数据的配置(resources 目录下的 application.properties 文件中)即可 2. 在 IntelliJ IDEA 中打开 项目 **OK,至此,服务端就启动成功了,此时我们直接在地址栏输入 `http://localhost:8081/index.html` 即可访问我们的项目,如果要做二次开发,请继续看第4步。** 4. 进入到vuehr目录中,在命令行依次输入如下命令: ``` # 安装依赖 npm install # 在 localhost:8080 启动项目 npm run serve ``` 由于我在 项目中已经配置了端口转发,将数据转发到 Spring Boot 上,因此项目启动之后,在浏览器中输入 `http://localhost:8080` 就可以访问我们的前端项目了,所有的请求通过端口转发将数据传到 Spring Boot 中(注意此时不要关闭 Sprin gBoot 项目)。
Spring Boot是一个用于创建独立的、基于Java的生产级应用程序的框架。它提供了一种简化和快速开发的方式,可以帮助开发人员更轻松地构建和部署应用程序。集成前端(HTML和Vue.js)到Spring Boot项目中可以通过以下步骤实现: 1. 创建Spring Boot项目。可以使用Spring Initializr或手动创建项目。 2. 引入Web依赖。在项目的pom.xml文件中添加Spring Boot的Web依赖,例如: ```xml <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> ``` 3. 创建前端页面。在项目的资源文件夹(src/main/resources)中创建一个静态资源文件夹(例如public或static)用于存放前端页面,例如index.html。 4. 创建Vue.js组件。可以使用Vue CLI来创建Vue.js组件,并将生成的组件文件放置在前端资源文件夹中。 5. 创建控制器。在Spring Boot项目的Java源文件夹中创建一个控制器类,用于处理前端请求并返回相应的数据或视图。 6. 配置路由。在Vue.js组件中配置路由,将不同的URL映射到相应的组件。 7. 配置跨域请求。由于前端和后端可能运行在不同的域名或端口上,需要配置跨域请求的支持。可以使用Spring Boot的CORS(Cross-Origin Resource Sharing)配置或使用其他方法来解决这个问题。 8. 启动应用程序。运行Spring Boot项目,并访问前端页面,即可通过URL访问前端页面及Vue.js组件。 通过以上步骤,可以成功集成(HTML和Vue.js)前端到Spring Boot项目中。前端页面可以通过Spring Boot的控制器来访问后端数据,并实现前后端的交互和协作。这样的集成可以提高开发效率和灵活性,使得应用程序更加现代化和易于维护。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值