基于springBoot搭建web项目并实现静态html资源自动加载

本文分以下几部分

1.基于springBoot搭建web项目
2.实现.html文件访问
3.实现.js.css…等html中静态资源加载
4.demo git下载地址

因为要搭建web项目,web项目少不了对jsp文件或者对html文件的解析,SpringBoot提供了大量的模板引擎来支持对这些和用户交互view文件的解析,包含以下截图中的四个模板引擎,因为Thymeleaf提供了完美的Spring MVC支持,所以本文直接使用Thymeleaf作为解析各类view的解析器
在这里插入图片描述

1.基于springBoot搭建web项目

1.1新建项目

在这里插入图片描述

1.2创建Spring Initializr工程

在这里插入图片描述

1.3输入自己定义的组织名和项目名称

在这里插入图片描述

1.4在web选项卡中勾选web项目,当然,勾选当中的Web Service也是可以的

在这里插入图片描述

1.5在Templates引擎中勾选Thymeleaf

在这里插入图片描述

1.6默认,点击finish

在这里插入图片描述

1.7删除无用文件

在这里插入图片描述

2.实现.html文件访问

2.1新建html文件

在这里插入图片描述

2.1新建HelloController文件

package com.mom.graphqls.test.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class HelloController {

    @RequestMapping("/hello")
    public String hello(){
        return "hello";
    }

}

在这里插入图片描述

2.2增加端口号和默认地址

server.address= 0.0.0.0
server.port= 10001

在这里插入图片描述

2.3修改SpringBootApplication注解排除检测数据库配置启动项目

 @SpringBootApplication(exclude={DataSourceAutoConfiguration.class,HibernateJpaAutoConfiguration.class})
GraphqlsApplication修改为以上注解,因为目前我们都是没有和数据库进行交互的,所以数据库的连接配置信息肯定是没有进行配置的,如果注解不修改为如下,启动项目是会报一下错误

在这里插入图片描述
在这里插入图片描述

2.4启动项目

在这里插入图片描述

2.5访问项目

http://localhost:10001/hello
在这里插入图片描述

3.实现.js.css…等html中静态资源加载

3.1新增静态文件,hello.js和hello.css

在这里插入图片描述
在这里插入图片描述

3.2在hello.html中引入这两个静态文件

在这里插入图片描述

3.3配置静态文件拦截与解析路径

在application.properties中配置如下解析路径,其中 spring.mvc.static-path-pattern= /static/**即为拦截访问路径中带/static/的路径,spring.resources.static-locations=classpath:/static/为指定该文件为静态文件并告诉服务器去哪个路径查找并解析文件

# 静态资源配置 默认值为 /**
spring.mvc.static-path-pattern= /static/**
# 默认值为 classpath:/META-INF/resources/,classpath:/resources/,classpath:/static/,classpath:/public/
spring.resources.static-locations=classpath:/static/

在这里插入图片描述
以上application.properties中的配置和以下的java 配置是等价的,配置静态资源访问只要这两个方案二选一即可,建议直接使用properties配置文件

    package com.mom.graphqls.test.aotuconfig;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

@Configuration
@EnableWebMvc
public class MyMvcConfig extends WebMvcConfigurerAdapter{

//    //继承WebMvcConfigurerAdapter实现无web.xml配置解析器
//    @Bean
//    public InternalResourceViewResolver viewResolver(){
//        InternalResourceViewResolver viewResolver = new InternalResourceViewResolver();
//        viewResolver.setPrefix("/WEB_INF/classes/views/");
//        viewResolver.setSuffix(".jsp");
//        viewResolver.setViewClass(JstlView.class);
//        return viewResolver;
//    }

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/static/**").addResourceLocations("classpath:/static/");
    }

}

在这里插入图片描述

3.4启动项目访问

在这里插入图片描述

  • 2
    点赞
  • 16
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值