SpringBoot整合Freemaker结合Vue实现页面填写一键自动生成Redis的配置文件

这篇具有很好参考价值的文章主要介绍了SpringBoot整合Freemaker结合Vue实现页面填写一键自动生成Redis的配置文件。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

🧑‍💻作者名称:DaenCode
🎤作者简介:啥技术都喜欢捣鼓捣鼓,喜欢分享技术、经验、生活。
😎人生感悟:尝尽人生百味,方知世间冷暖。
📖所属专栏:SpringBoot实战


系列文章目录

标题
一文带你学会使用SpringBoot+Avue实现短信通知功能(含重要文件代码)
一张思维导图带你学会Springboot创建全局异常、自定义异常
一张思维导图带你打通SpringBoot自定义拦截器的思路
28个SpringBoot项目中常用注解,日常开发、求职面试不再懵圈
一张思维导图带你学会SpringBoot、Vue前后端分离项目线上部署
一张流程图带你学会SpringBoot结合JWT实现登录功能
一张思维导图带你学会使用SpringBoot中的Schedule定时发送邮件
一张思维导图带你学会使用SpringBoot异步任务实现下单校验库存
一张思维导图带你学会SpringBoot使用AOP实现日志管理功能
一张图带你学会入门级别的SpringBoot实现文件上传、下载功能
一张思维导图带你学会SpringBoot自定义Filter
一张思维导图带你学会SpringBoot整合Redis

SpringBoot整合Freemaker结合Vue实现页面填写一键自动生成Redis的配置文件,SpringBoot实战,springboot,freemaker,redis


🌟前言

在一次搭建Redis哨兵模式时,在最后验证是否搭建成功时节点信息是错误的,经过排查,最后因为是配置文件出错导致的。

于是,我就想有没有一种办法可以通过可视化的方式去配置Redis配置文件,这样可以避免直接修改配置文件时,因视觉问题而造成配置文件出错,也可能是我视力差。

最后,我想到了使用SpringBoot整合Freemaker并结合Vue实现自动生成配置文件来减少错误率的发生。


🌟SpringBoot整合Freemaker

pom依赖引入

<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>

修改配置文件

server.port=8081
#整合freeemaker
#模板所在路径
spring.freemarker.template-loader-path= classpath:/templates
#模板后缀名
spring.freemarker.suffix= .ftl
spring.freemarker.settings.classic_compatible=true

配置参数实体类

创建配置参数实体类,这里省略了getter、setter方法。

/**
 * 配置参数实体类
 */
public class ConfigParams {
    /**
     * 指定服务器监听的ip地址
     */
    private String bind;
    /**
     * 端口号
     */
    private String port;
    /**
     * 是否开启守护进程
     */
    private boolean isDamonize;
    /**
     * 访问redis密码
     */
    private String requirepass;
    /**
     * 日志文件的路径
     */
    private String logPath;
    /**
     * 持久化文件名称
     */
    private String dbFileName;
    /**
     * 持久化文件存储路径
     */
    private String dirPath;
    /**
     * rdb持久化策略配置
     */
    private String rdbPolicy;
    /**
     * 是否开启aof
     */
    private boolean isAof;
    /**
     * 主节点访问密码
     */
    private String masterauth;
    /**
     * 指定从哪个主节点复制
     */
    private String replicaof;

Controller类

@RestController
@RequestMapping("/api/v1/redis")
public class RedisConfigController {
    @PostMapping("generate")
    public JsonData generateConfig(@RequestBody ConfigParams configParams) throws IOException, TemplateException {
      //自动生成配置文件的工具类
      GenetateConfigUtil.generateConfigFile(configParams,"E:\\IdeaWorkspace\\config-tools\\redis.conf");
        return JsonData.buildSuccess();
    }
}

自动生成文件工具类

通过整合Freemaker配置,自动生成Redis配置文件。
逻辑流程

  1. 创建Freemaker配置。
  2. 从路径中读取Redis模板文件。
  3. 加载模板文件。
  4. 构造模板数据,将前端传入的数据存放到模板中。
  5. 生成最终的配置文件内容。
public class GenetateConfigUtil {
    public static void generateConfigFile(ConfigParams configParams,String generateFilePath) throws IOException, TemplateException {
        //创建freemarker配置
        Configuration configuration=new Configuration(Configuration.VERSION_2_3_31);
        configuration.setDirectoryForTemplateLoading(new File("E:\\IdeaWorkspace\\config-tools\\src\\main\\" +
                "resources\\templates\\"));
        // 加载模板文件
        Template template = configuration.getTemplate("redis-config-template.ftl");
        boolean daemonizeFlag=false;
        if (configParams.isDamonize()==true){
            daemonizeFlag=true;
        }
        // 构造模板数据
        Map<String, Object> data = new HashMap<>();
        data.put("bindIp", configParams.getBind());
        data.put("port", configParams.getPort());
        data.put("daemonize",daemonizeFlag);
        data.put("requirepass",configParams.getRequirepass());
        data.put("logfilepath",configParams.getLogPath());
        data.put("dbfilename",configParams.getDbFileName());
        data.put("rdbpolicy",configParams.getRdbPolicy());
        data.put("dirPath",configParams.getDirPath());
        data.put("masterauth",configParams.getMasterauth());
        data.put("replicaof",configParams.getReplicaof());
        // 生成最终的配置文件内容
        FileWriter writer = new FileWriter(generateFilePath);
        template.process(data, writer);
        writer.flush();
        writer.close();
    }
}

Redis配置模板文件

在templates下创建模板文件redis-config-template.ftl。
SpringBoot整合Freemaker结合Vue实现页面填写一键自动生成Redis的配置文件,SpringBoot实战,springboot,freemaker,redis
模板代码

#任何IP都可以访问
<#if bindIp?has_content>
bind ${bindIp}
</#if>
#端口号
<#if port?has_content>
port ${port}
</#if>
#守护进程
<#if daemonize?has_content>
daemonize ${daemonize?string('yes','no')}
</#if>
#密码
<#if requirepass?has_content>
requirepass "${requirepass}"
</#if>
#日志文件
<#if logfilepath?has_content>
logfile "${logfilepath}"
</#if>
# 持久化文件名称
<#if dbfilename?has_content>
dbfilename "${dbfilename}"
</#if>
#持久化文件存储路径
<#if dirPath?has_content>
dir "${dirPath}"
</#if>
#持久化策略
<#if rdbpolicy?has_content>
save ${rdbpolicy}
</#if>
#访问主节点的密码
<#if masterauth?has_content>
masterauth "${masterauth}"
</#if>
#指定从哪个节点复制
<#if replicaof?has_content>
replicaof "${replicaof}"
</#if>

🌟Vue代码

关于创建步骤就不具体介绍了,下边直接给出页面代码。

<template>
  <div class="redisConfig">
    <h2 align="center">Redis配置文件生成</h2>
    <div class="redisForm">
    <el-row :gutter="15">
      <el-form ref="elForm" :model="formData" :rules="rules" size="mini" label-width="105px" 
        label-position="right">
        <el-col :span="24">
          <el-form-item label="服务器监听IP" prop="bind">
            <el-input v-model="formData.bind" placeholder="请输入服务器监听IP" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="端口号" prop="port">
            <el-input v-model="formData.port" placeholder="请输入端口号" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="1">
          <el-form-item label="是否开启守护进程" prop="isDamonize">
            <el-switch v-model="formData.isDamonize"></el-switch>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="Redis密码" prop="requirepass">
            <el-input v-model="formData.requirepass" placeholder="请输入Redis密码" clearable show-password
              :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="日志文件路径" prop="logPath">
            <el-input v-model="formData.logPath" placeholder="/path/xxx.log" clearable
              :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="持久化文件名" prop="dbFileName">
            <el-input v-model="formData.dbFileName" placeholder="请输入持久化文件名" clearable
              :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="持久化文件路径" prop="dirPath">
            <el-input v-model="formData.dirPath" placeholder="/path/data" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="RDB持久化策略配置" prop="rdbPolicy">
            <el-input v-model="formData.rdbPolicy" placeholder="save <minute> <changes>" clearable
              :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="1">
          <el-form-item label="是否开启AOF持久化" prop="isAof">
            <el-switch v-model="formData.isAof"></el-switch>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="主节点访问密码" prop="masterauth">
            <el-input v-model="formData.masterauth" placeholder="请输入主节点访问密码" clearable show-password
              :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="指定复制主节点" prop="replicaof">
            <el-input v-model="formData.replicaof" placeholder="请输入指定复制主节点IP" clearable
              :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item size="large">
            <el-button type="primary" @click="submitForm">提交</el-button>
            <el-button @click="resetForm">重置</el-button>
          </el-form-item>
        </el-col>
      </el-form>
    </el-row>
    </div>
  </div>
</template>
<script>
export default {
  components: {},
  props: [],
  data() {
    return {
      formData: {
        bind: "",
        port: undefined,
        isDamonize: false,
        requirepass: undefined,
        logPath: undefined,
        dbFileName: undefined,
        dirPath: "",
        rdbPolicy: undefined,
        isAof: undefined,
        masterauth: undefined,
        replicaof: undefined,
      },
      rules: {
        bind: [{
          required: true,
          message: '请输入服务器监听IP',
          trigger: 'blur'
        }],
        port: [{
          required: true,
          message: '请输入端口号',
          trigger: 'blur'
        }],
        requirepass: [],
        logPath: [],
        dbFileName: [],
        dirPath: [],
        rdbPolicy: [],
        masterauth: [],
        replicaofIp: [],
        replicaofPort: [],
      },
    }
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {
    submitForm() {
      this.$refs['elForm'].validate(valid => {
        if (valid) {
            this.request.post("/api/v1/redis/generate", this.formData).then(res => {
            if(res.code === '0') {
              this.$message.success("生成成功")
            } else {
              this.$message.error(res.msg)
            }
          })
        }
      })
    },
    resetForm() {
      this.$refs['elForm'].resetFields()
    },
  }
}

</script>
<style>
.redisConfig {
  position: fixed;
  width: 100%;
  height: 100vh; /* 可以根据需要设置高度 */
}

.redisForm {
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%); /* 平移至中心位置 */
  /* 根据需要设置内容样式 */
}

</style>

页面效果图

SpringBoot整合Freemaker结合Vue实现页面填写一键自动生成Redis的配置文件,SpringBoot实战,springboot,freemaker,redis

🌟效果测试

在页面填写完相关信息提交后,将会在指定路径下生成配置文件。
SpringBoot整合Freemaker结合Vue实现页面填写一键自动生成Redis的配置文件,SpringBoot实战,springboot,freemaker,redis

🌟写在最后

有关于SpringBoot整合Freemaker结合Vue实现页面填写一键自动生成Redis的配置文件到此就结束了。

感谢大家的阅读,希望大家在评论区对此部分内容散发讨论,便于学到更多的知识。


SpringBoot整合Freemaker结合Vue实现页面填写一键自动生成Redis的配置文件,SpringBoot实战,springboot,freemaker,redis文章来源地址https://www.toymoban.com/news/detail-695405.html

到了这里,关于SpringBoot整合Freemaker结合Vue实现页面填写一键自动生成Redis的配置文件的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • springboot整合Minio + vue 实现文件分片上传(完整代码)

    网上关于minio分片上传的资料不太详细,缺斤少两,所以我基于他们的代码做了一些修改,demo能够正常运行起来,但是偶尔也会发生一些小bug,不过这些都无伤大雅,最终目的是理解代码背后的逻辑和流程 流程: 前端获取生成文件MD5,发送至后台判断是否有该文件缓存,有

    2024年02月02日
    浏览(41)
  • springboot整合阿里大于并结合mq发送短信

    在 pom.xml 文件中添加以下依赖: 在 application.properties 文件中添加以下配置: 其中, accessKeyId 和 accessKeySecret 是阿里云控制台上的AccessKey, signName 是短信签名, templateCode 是短信模板ID。 在Spring Boot中,我们可以使用MQ来异步发送短信,提高系统的响应速度。这里以ActiveMQ为例

    2024年02月08日
    浏览(33)
  • Vue+SpringBoot项目开发:登录页面美化,登录功能实现(三)

    上一章写了从零开始Vue+SpringBoot后台管理系统:Vue3+TypeScript项目搭建 Vue+TypeScript的前端项目已经搭建完成了 这一章的内容是引入element-plus和axios实现页面的布局和前后端数据的串联,实现一个登陆的功能,跳转到首页 现在前端项目的一个结构目录 在src/main.js中加入element-plus

    2024年02月13日
    浏览(35)
  • 整合vue elementui springboot mybatisplus前后端分离的 简单增加功能 删改查未实现

    涉及知识点 1.springboot项目启动创建  配置yml文件 2.mybatisplus的使用 3.vue的vite文件配置 4.vue springboot 前后端数据交互 1.建立项目的配置文件 src/main/resources/application.yml 2.建立项目 pom.xml 3.建立数据库表 4.建立实体类 cn.webrx.pojo.User 5.建立项目入口程序App cn.webrx.App 6.建立sevices axi

    2024年02月07日
    浏览(34)
  • SpringBoot整合hdfs,实现文件上传下载删除与批量删除,以及vue前端发送请求,实现前后端交互功能;

    部分工具类代码参考文章:https://blog.csdn.net/qq_27242695/article/details/119683823 前端实现效果 HDFSController HDFS FileInterface (文件接口) HDFS FileImplService (文件接口实现类) HDFSConfig(从yaml读取文件) HDFSUTils 前端vue代码:

    2024年02月16日
    浏览(68)
  • SpringBoot结合Vue.js+axios框架实现增删改查功能+网页端实时显示数据库数据(包括删除多条数据)

    本文适用对象:已有基础的同学,知道基础的SpringBoot配置和Vue操作。 在此基础上本文实现基于SpringBoot和Vue.js基础上的增删改查和数据回显、刷新等。 实现步骤: 第1步:编写动态请求响应类:在启动类同父目录下创建controller包,在包下创建DataController类,添加@RestController、

    2024年02月04日
    浏览(38)
  • SpringBoot结合thymeleaf的HTML页面不能跳转问题踩坑

    问题描述:写了一个上传接口,controller不能跳转到thymeleaf的HTML页面“uploadsuccess”,试了好几个方法,都不起作用,后来发现是注解@ResponseBody 的原因,把@ResponseBody 去掉,问题解决,记录一下这个问题 @RestController相当于@Controller+@ResponseBody两者的结合 @Controller 的使用一般是加

    2024年01月23日
    浏览(25)
  • SpringBoot 整合Thymeleaf教程及使用 springboot配合thymeleaf,调用接口不跳转页面只显示文本

    Thymeleaf 是一款用于渲染 XML/XHTML/HTML5 内容的模板引擎。它与 JSP,Velocity,FreeMaker 等模板引擎类似,也可以轻易地与 Spring MVC 等 Web 框架集成。与其它模板引擎相比,Thymeleaf 最大的特点是,即使不启动 Web 应用,也可以直接在浏览器中打开并正确显示模板页面 。 目录 一、整合

    2024年02月08日
    浏览(67)
  • 微信小程序 表单 选择跳转新页面,选择后,返回上一页面保留原页面已填写的值

    场景: 表单页有很多项需要填写,个别项数据较多,需要跳转到新的页面去选择后,带着结果返回。如图。 此时,想要返回时,已经填写过的内容保留不变,不被清空。 解决: 在下一页去获取上一页data中的数据,并修改,再通过 wx.navigateBack({ delta: 1, }) 返回上一页,页面不

    2024年02月12日
    浏览(29)
  • vue和Springboot的整合

    vue和Springboot整合实现前后端分离 第一步: 分别创建两个项目一个为vue项目一个为Springboot项目分别用idea进行打开【vue项目也可以用webStrom打开】 第二步: 端口设置,先npm run dev 运行vue项目此时端口为8080端口,然后再在Springboot项目里修改端口号 防止端口冲突 这个时候就可以

    2024年02月11日
    浏览(16)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包