【无标题】

该博客围绕在线编写SQL并实现查询功能的项目展开。介绍了项目需求,即用户可切换数据源、输入SQL查询,结果以JSON格式显示。阐述了项目搭建步骤,包括引入依赖、编写配置等。还分析了项目难点,如对JDBC API理解不足、处理查询语句及数据源切换等问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

前言:

由于前段时间,项目组长分配的任务是要完成一个在线编写 SQL 并要实现查询功能的需求,最终需要将查询到的数据以 JSON 格式显示到响应数据的区域,以供操作者进行查看,一开始拿到需求时想着直接使用 Mybatis 进行操作不就可以了,完全没必要大费周章,因为在 MyBatis 中有个拼接 SQL 的语法,可以使用 ${sql} 来进行执行输入的 SQL 语句,但是实际操作起来并不是想象中的那么简单,因为使用 MyBatis 会将数据源固定在本项目所使用的数据库,而不可以进行数据源之间的切换,无法进行其他数据源中表的查询操作 :x:,所以在实现过程也是相当艰难曲折…

难度分析

在线执行 SQL 语句的查询主要的难点分为以下几点:其一则是对 JDBC 的部分的 API 理解的不够透彻,导致在实现某些工鞥是并不是想象中的顺利;其二在于对于查询部分属性的SQL语句该如何使用 Java 进行实现,是将输入的字符串进行分割再拼接还是使用直接整条语句的查询操作;其三则是用户可以动态的切换数据源,并且对相应数据源下的表进行查询操作,如果使用 Mybatis 进行 SQL 的查询操作则无法进行数据源的切换,只能查询所在微服务项目所连接的数据库进行查询,否则无法进行相应的操作,即会出现该数据库下并不存在所查询的某张数据库表的错误信息 :x:

 项目回顾(在线编写SQL查询)

 需求分析

使用者在页面可以选择切换需要操作的数据源,并在编辑区域内输入 SQL 语句进行查询,查询语句可以是全表查询表中所有字段或者根据所需查询指定某几列字段对应的值,点击查询之后即可在响应数据之后以 JSON 的格式将查询到的每一条数据封装一个对象最后显示到响应数据区域以供操作者进行观看以达到可视化工具的效果。

 项目搭建

① 引入项目所需要的相关Maven依赖

<!--SpringBoot相关依赖-->
<dependency>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
  <groupId>commons-lang</groupId>
  <artifactId>commons-lang</artifactId>
  <version>2.6</version>
</dependency>
<!--servlet-api相关依赖-->
<dependency>
  <groupId>javax.servlet</groupId>
  <artifactId>servlet-api</artifactId>
  <version>2.5</version>
  <scope>provided</scope>
</dependency>
<!--MySQL驱动相关依赖-->
<dependency>
  <groupId>mysql</groupId>
  <artifactId>mysql-connector-java</artifactId>
  <version>8.0.28</version>
</dependency>

② 编写配置文件

server:
  port: 8080
spring:
  datasource:
    username: root
    password: root
    driver-class-name: com.mysql.cj.jdbc.Driver
    url: jdbc:mysql://localhost:3306/data_source?useUnicode=true&characterEncoding=UTF-8&useSSL=false&serverTimezone=Asia/Shanghai

③ 创建Controller前端控制器

@PostMapping("/dynamic-query")
	@ApiOperation(value = "动态执行SQL")
	public Result<?> dynamicQuery(@RequestBody DynamicQuery dynamicQuery){
 
		List<HashMap<Object,Object>> res = null;
		BladeVisualDb visualDb = bladeVisualDbService.getOne(new QueryWrapper<BladeVisualDb>().eq("id", dynamicQuery.getId()));
		List<HashMap<String,Object>> result = ConnectBySql.connAndExecSql(visualDb.getUrl(), visualDb.getDriverClass(), visualDb.getUsername(), visualDb.getPassword(),dynamicQuery.getSql());
		return Result.ok(result);
	}

④ 探究 JDBC中ResultSet中的方法

  • next()

解释:将光标从其当前位置向前移动一行。 ResultSet 游标最初位于第一行之前;第一次调用 next 方法使第一行成为当前行;第二次调用使第二行成为当前行,依此类推。实则对查询到的数据进行遍历操作

  • getString(String columnLabel)

解释:根据表中对应的列名称来查询到该列对应到的数据

  • getMetaData()

解释:获取某张表中列的数量、类型和列名称

  • findColumn(String columnLabel)

解释:返回某个列的索引值即下标

⑤ 获取所有的数据源

因为使用者是可以动态的选择数据源从而来对表中的数据进行相关操作,所以首先要查询出可供连接的数据源

/**
	  * 下拉数据源列表
	  * @return
	  */
	@ApiOperation(value = "下拉列表")
	@GetMapping("/db-list")
	public Result<?> list(){
 
		List<BladeVisualDb> bladeVisualDbs = bladeVisualDbService.list();
		return Result.ok(bladeVisualDbs);
	}

⑥ 实现执行查询逻辑

首先执行查询有两种方式:所有字段的全查询即 select * from xx 或者 查询指定字段即 select xx from xx

  • 所有字段的全查询即 select * from xx

在进行所有字段的查询时,由于无法得知需要查询的表中有什么字段,所以首先需要对输入的 SQL 字符串进行判断是否是全字段查询,然后即可获取查询表中的所有字段,然后再一一的进行查询出字段对应的值即可,此操作也是需要对输入 SQL 字符串进行分割的,拿出所有插叙的表名即可。

ResultSet resultSet = stmt.executeQuery(sql);
//如果输入的SQL属于select * 操作
if (sql.contains("*")){
 
  List<String> list = new ArrayList<>();
  //获取SQL中需要查询的表的结构
  ResultSetMetaData metaData = resultSet.getMetaData();
  int columnCount = metaData.getColumnCount();
  for (int i = 1; i <= columnCount; i++) {
 
    log.info("属性列   ======>{}",metaData.getColumnName(i));
    //获取表中的所有列
    list.add(metaData.getColumnName(i));
  }
  while (resultSet.next()){
 
    HashMap<String,Object> hashMap = new HashMap<>();
    for (String index : list) {
 
      //根据列名称查询出该列对应的数据
      String rs = resultSet.getString(index);
      //将其放入列和值存放HashMap中
      hashMap.put(index,rs);
      //将多个HashMap合并成一个Map
      hashMap.putAll(hashMap);
    }
    res.add(hashMap);
  }
}
  • 查询指定字段即 select xx from xx

在使用 JDBC 进行指定字段查询时需要对输入的 SQL 字符串进行分割后将所需要查询到的字段再使用 JDBC 中的 getString(String columnName) 进行查询字段对应的值

/**
     * 将SQL语句进行拆分
     * @param sql
     * @return
     */
    @NotNull
    private static List<String> getString(String sql) {
 
        List<String> list = new ArrayList<>();
        String str = sql.substring(0, sql.indexOf("from"));
        String realSql = str.replace("select", "").trim();
        if (realSql.contains(",")){
 
            String[] split = realSql.split(",");
            for (String s : split) {
 
                list.add(s);
            }
        }else {
 
            list.add(realSql);
        }
        return list;
    }

随后将分割完成的 SQL 存放到 List 集合中再进行查询操作

ResultSet resultSet = stmt.executeQuery(sql);
while (resultSet.next()){
 
  HashMap<String,Object> hashMap = new HashMap<>();
  List<String> str = getString(sql);
  for (String index : str) {
 
    String rs = resultSet.getString(index);
    hashMap.put(index,rs);
    hashMap.putAll(hashMap);
  }
  res.add(hashMap);
}

经过对操作者输入的 SQL 即可完成对表的查询操作,由于所要实现的是可动态切换数据源从而进行相关的查询操作,所以在此操作逻辑中首先需要连接数据库,后再对输入的 SQL 进行分割查询等操作。合并后的完整代码:

/**
     * 连接数据库并根据输入的SQL语句查询数据
     * @param url
     * @param driverClass
     * @param username
     * @param password
     * @param sql
     * @return
     */
    public static List<HashMap<String,Object>> connAndExecSql(String url, String driverClass, String username, String password, String sql) {
 
        Boolean result = false;
        Connection conn = null;
        Statement stmt = null;
        List<HashMap<String,Object>> res = new ArrayList<>();

        try {
 
            Class.forName(driverClass);
            System.out.println("------------连接数据库-----------");
            conn = DriverManager.getConnection(url,username,password);
            stmt = conn.createStatement();

            ResultSet resultSet = stmt.executeQuery(sql);
            //如果输入的SQL属于select * 操作
            if (sql.contains("*")){
 
                List<String> list = new ArrayList<>();
                //获取SQL中需要查询的表的结构
                ResultSetMetaData metaData = resultSet.getMetaData();
                int columnCount = metaData.getColumnCount();
                for (int i = 1; i <= columnCount; i++) {
 
                    log.info("属性列   ======>{}",metaData.getColumnName(i));
                    //获取表中的所有列
                    list.add(metaData.getColumnName(i));
                }
                while (resultSet.next()){
 
                    HashMap<String,Object> hashMap = new HashMap<>();
                    for (String index : list) {
 
                        //根据列名称查询出该列对应的数据
                        String rs = resultSet.getString(index);
                        //将其放入列和值存放HashMap中
                        hashMap.put(index,rs);
                        //将多个HashMap合并成一个Map
                        hashMap.putAll(hashMap);
                    }
                    res.add(hashMap);
                }
            }else {
 
                while (resultSet.next()){
 
                    HashMap<String,Object> hashMap = new HashMap<>();
                    List<String> str = getString(sql);
                    for (String index : str) {
 
                        String rs = resultSet.getString(index);
                        hashMap.put(index,rs);
                        hashMap.putAll(hashMap);
                    }
                    res.add(hashMap);
                }
            }
            //完成连接数据库
            stmt.close();
            conn.close();
            System.out.println("查询连接结束");
        } catch (ClassNotFoundException e) {
 
            e.printStackTrace();
        }catch (SQLException e){
 
            e.printStackTrace();
        }
        return res;
    }

    /**
     * 将SQL语句进行拆分
     * @param sql
     * @return
     */
    @NotNull
    private static List<String> getString(String sql) {
 
        List<String> list = new ArrayList<>();
        String str = sql.substring(0, sql.indexOf("from"));
        String realSql = str.replace("select", "").trim();
        if (realSql.contains(",")){
 
            String[] split = realSql.split(",");
            for (String s : split) {
 
                list.add(s);
            }
        }else {
 
            list.add(realSql);
        }
        return list;
    }

⑦ Vue前端引入monaco-editor组件进行编写SQL语句

 项目总结

在使用 JDBC 来进行数据库的操作,在使用时由于对其方法并不是全部了解,所以需要边看源码边改善功能,因此遇到问题时才会感觉到脑中知识储备的不足,目前只是实现了查询操作,还未完善 CRUD 全部过程的操作。

ECharts 是一款由百度开发的、基于 JavaScript 的开源数据可视化库,它提供了丰富的图表类型和高度的可定制性,以帮助开发者轻松创建交互性强、美观且响应迅速的数据可视化界面。ECharts 支持在各种现代浏览器(包括移动设备上的浏览器)以及部分旧版浏览器(如 IE8/9/10/11)中运行,其底层依赖轻量级矢量图形库 ZRender,确保了图表渲染的高效性和跨平台兼容性。 以下是一些关于使用 ECharts 进行数据可视化的关键特性、图表类型和基本使用步骤: ### 关键特性 1. **开源免费**:ECharts 是开源软件,可以免费用于个人和商业项目,无需支付任何费用。 2. **广泛兼容**:支持多种浏览器环境,包括但不限于 Chrome、Firefox、Safari 和 Internet Explorer 系列,保证在不同设备和操作系统上的良好表现。 3. **丰富图表类型**:包括但不限于折线图、柱状图、散点图、饼图、K线图、盒形图、地图、热力图、线图、关系图、treemap、旭日图、平行坐标、漏斗图、仪表盘等,以及三维可视化组件(通过 ECharts GL 扩展)。 4. **交互性强**:图表支持鼠标悬停提示、数据区域缩放、图表联动、图表堆叠、数据过滤、图例开关等多种交互功能,提升用户对数据的探索和理解能力。 5. **个性化定制**:提供详细的配置选项,允许用户自定义图表的颜色、字体、网格线、图例、tooltip、轴标签、数据标签、动画效果等,以满足特定设计需求和品牌风格。 6. **数据更新动态渲染**:能够实时接收新数据并动态更新图表,适用于数据流或实时监控场景。 7. **扩展性**:除了核心库外,有 ECharts GL 用于三维和大规模地理数据可视化,以及周边生态工具(如 ECharts-GL、ZRender)增强其功能和适用范围。 ### 图表类型 ECharts 提供的图表类型涵盖了数据分析和展示的常见需求,包括: - **基础图表**:折线图、柱状图、散点图、饼图、K线图 - **统计图表**:盒形图 - **地理图表**:地图、热力图、线图 - **关系图表**:关系图、treemap、旭日图 - **多维数据可视化**:平行坐标 - **BI图表**:漏斗图、仪表盘 此外,ECharts 支持图表间的混搭,即在一个图表容器内同时展现多种图表类型,以对比或关联不同数据维度。 ### 使用步骤 使用 ECharts 进行数据可视化的一般步骤如下: #### 1. 引入 ECharts 库 在 HTML 文件中通过 `<script>` 标签引入 ECharts 的核心文件: ```html <script src="https://cdn.jsdelivr.net/npm/echarts@版本号/dist/echarts.min.js"></script> ``` 确保替换 `版本号` 为所需的 ECharts 版本。 #### 2. 准备 DOM 容器 在页面上创建一个用于承
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值