SSM框架分页展示Hdfs文件列表上传文件，删除文件，下载文件前后端代码

由于HDFS是一个分布式文件系统，因此我们需要使用Hadoop提供的Java API来操作它。在操作HDFS之前，我们需要先构建Hadoop的环境，具体可以参考Hadoop官方文档。

接下来，我们来实现SSM框架分页展示HDFS文件列表上传文件，删除文件，下载文件的前后端代码。

1. 后端代码

首先，我们需要定义一个HadoopUtils工具类，用于连接HDFS并实现文件上传、删除和下载等操作。

HadoopUtils.java

package com.example.demo.utils;

import org.apache.hadoop.conf.Configuration;
import org.apache.hadoop.fs.*;
import org.apache.hadoop.io.IOUtils;
import org.springframework.stereotype.Component;

import java.io.*;
import java.net.URI;
import java.util.ArrayList;
import java.util.List;

@Component
public class HadoopUtils {

    private static String hdfsUri = "hdfs://localhost:9000";
    private static String hdfsUser = "hadoop";

    /**
     * 获取FileSystem对象
     *
     * @return FileSystem对象
     * @throws IOException
     */
    private FileSystem getFileSystem() throws IOException {
        Configuration configuration = new Configuration();
        configuration.set("fs.defaultFS", hdfsUri);
        return FileSystem.get(URI.create(hdfsUri), configuration, hdfsUser);
    }

    /**
     * 将本地文件上传到HDFS
     *
     * @param srcFile  本地文件路径
     * @param destPath HDFS目标路径
     * @throws IOException
     */
    public void uploadFile(String srcFile, String destPath) throws IOException {
        FileSystem fileSystem = getFileSystem();
        Path srcPath = new Path(srcFile);
        Path dest = new Path(destPath);
        fileSystem.copyFromLocalFile(srcPath, dest);
        fileSystem.close();
    }

    /**
     * 删除HDFS上的文件
     *
     * @param filePath HDFS文件路径
     * @throws IOException
     */
    public void deleteFile(String filePath) throws IOException {
        FileSystem fileSystem = getFileSystem();
        Path path = new Path(filePath);
        fileSystem.delete(path, true);
        fileSystem.close();
    }

    /**
     * 下载HDFS上的文件到本地
     *
     * @param srcPath  HDFS文件路径
     * @param destPath 本地目标路径
     * @throws IOException
     */
    public void downloadFile(String srcPath, String destPath) throws IOException {
        FileSystem fileSystem = getFileSystem();
        Path src = new Path(srcPath);
        Path dest = new Path(destPath);
        FSDataInputStream inputStream = fileSystem.open(src);
        OutputStream outputStream = new FileOutputStream(dest.toString());
        IOUtils.copyBytes(inputStream, outputStream, 4096, true);
        fileSystem.close();
    }

    /**
     * 获取HDFS上指定目录下的文件列表
     *
     * @param path HDFS目录路径
     * @return 文件列表
     * @throws IOException
     */
    public List<String> getFileList(String path) throws IOException {
        FileSystem fileSystem = getFileSystem();
        Path listPath = new Path(path);
        RemoteIterator<LocatedFileStatus> files = fileSystem.listFiles(listPath, true);
        List<String> fileList = new ArrayList<>();
        while (files.hasNext()) {
            fileList.add(files.next().getPath().toString());
        }
        fileSystem.close();
        return fileList;
    }
}

然后，我们需要编写一个Controller类，用于处理文件上传、删除和下载等操作。

FileController.java

package com.example.demo.controller;

import com.example.demo.utils.HadoopUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;

import java.io.IOException;
import java.util.List;

@Controller
public class FileController {

    @Autowired
    private HadoopUtils hadoopUtils;

    /**
     * 分页展示HDFS文件列表
     *
     * @param page  当前页码
     * @param limit 每页显示的记录数
     * @param model
     * @return
     * @throws IOException
     */
    @GetMapping("/file")
    public String getFileList(@RequestParam(value = "page", defaultValue = "1") int page,
                              @RequestParam(value = "limit", defaultValue = "10") int limit,
                              Model model) throws IOException {
        String path = "/";
        List<String> fileList = hadoopUtils.getFileList(path);
        int total = fileList.size();
        int start = (page - 1) * limit;
        int end = Math.min(start + limit, total);
        List<String> subList = fileList.subList(start, end);
        model.addAttribute("fileList", subList);
        model.addAttribute("page", page);
        model.addAttribute("limit", limit);
        model.addAttribute("total", total);
        return "file_list";
    }

    /**
     * 上传文件
     *
     * @param file     上传的文件
     * @param destPath HDFS目标路径
     * @return
     * @throws IOException
     */
    @PostMapping("/file/upload")
    @ResponseBody
    public String uploadFile(@RequestParam("file") MultipartFile file,
                             @RequestParam("destPath") String destPath) throws IOException {
        if (file.isEmpty()) {
            return "上传失败，请选择文件！";
        }
        hadoopUtils.uploadFile(file.getOriginalFilename(), destPath);
        return "上传成功！";
    }

    /**
     * 删除文件
     *
     * @param filePath HDFS文件路径
     * @return
     * @throws IOException
     */
    @DeleteMapping("/file/delete")
    @ResponseBody
    public String deleteFile(@RequestParam("filePath") String filePath) throws IOException {
        hadoopUtils.deleteFile(filePath);
        return "删除成功！";
    }

    /**
     * 下载文件
     *
     * @param srcPath  HDFS文件路径
     * @param destPath 本地目标路径
     * @return
     * @throws IOException
     */
    @GetMapping("/file/download")
    @ResponseBody
    public String downloadFile(@RequestParam("srcPath") String srcPath,
                                @RequestParam("destPath") String destPath) throws IOException {
        hadoopUtils.downloadFile(srcPath, destPath);
        return "下载成功！";
    }
}

2. 前端代码

接下来，我们需要编写前端页面来展示HDFS文件列表，并实现文件上传、删除和下载等操作。

file_list.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HDFS文件列表</title>
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.5.2/css/bootstrap.min.css">
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.5.2/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
    <h1 class="text-center">HDFS文件列表</h1>
    <hr>
    <div class="row">
        <div class="col-md-12">
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th>文件名</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                {{#fileList}}
                <tr>
                    <td>{{this}}</td>
                    <td>
                        <button class="btn btn-primary download-btn" data-src="{{this}}">下载</button>
                        <button class="btn btn-danger delete-btn" data-path="{{this}}">删除</button>
                    </td>
                </tr>
                {{/fileList}}
                </tbody>
            </table>
        </div>
    </div>
    <nav aria-label="Page navigation example">
        <ul class="pagination">
            {{#prev}}
            <li class="page-item"><a class="page-link" href="?page={{this}}&limit={{../limit}}">&laquo;</a></li>
            {{/prev}}
            {{#pageList}}
            <li class="page-item {{active}}"><a class="page-link" href="?page={{this}}&limit={{../limit}}">{{this}}</a>
            </li>
            {{/pageList}}
            {{#next}}
            <li class="page-item"><a class="page-link" href="?page={{this}}&limit={{../limit}}">&raquo;</a></li>
            {{/next}}
        </ul>
    </nav>
    <div class="row">
        <div class="col-md-12">
            <form id="upload-form">
                <div class="form-group">
                    <label for="destPath">HDFS目标路径：</label>
                    <input type="text" class="form-control" id="destPath" name="destPath" placeholder="/test">
                </div>
                <div class="form-group">
                    <label for="file">选择文件：</label>
                    <input type="file" class="form-control-file" id="file" name="file">
                </div>
                <button type="submit" class="btn btn-primary">上传</button>
            </form>
        </div>
    </div>
</div>
<script>
    $(function () {
        // 文件上传
        $("#upload-form").submit(function (event) {
            event.preventDefault();
            let formData = new FormData($(this)[0]);
            $.ajax({
                url: "/file/upload",
                type: "POST",
                data: formData,
                cache: false,
                contentType: false,
                processData: false,
                success: function (data) {
                    alert(data);
                },
                error: function () {
                    alert("上传失败！");
                }
            });
        });
        // 文件删除
        $(".delete-btn").click(function () {
            let filePath = $(this).data("path");
            if (confirm("确定要删除该文件吗？")) {
                $.ajax({
                    url: "/file/delete",
                    type: "DELETE",
                    data: {
                        filePath: filePath
                    },
                    success: function (data) {
                        alert(data);
                        location.reload();
                    },
                    error: function () {
                        alert("删除失败！");
                    }
                });
            }
        });
        // 文件下载
        $(".download-btn").click(function () {
            let srcPath = $(this).data("src");
            let destPath = prompt("请输入本地目标路径：");
            if (destPath) {
                $.ajax({
                    url: "/file/download",
                    type: "GET",
                    data: {
                        srcPath: srcPath,
                        destPath: destPath
                    },
                    success: function (data) {
                        alert(data);
                    },
                    error: function () {
                        alert("下载失败！");
                    }
                });
            }
        });
    });
</script>
</body>
</html>

在上述代码中，我们使用了Bootstrap来美化页面，并使用了Mustache模板引擎来动态渲染文件列表和分页导航等内容。同时，我们使用了jQuery来实现文件上传、删除和下载等操作的异步请求。

以上就是SSM框架分页展示HDFS文件列表上传文件，删除文件，下载文件前后端代码的实现。