2021-08-11

关注

原创最新推荐文章于 2026-05-03 10:01:41 发布 155 阅读 AI 写同款· GEO 优化 ›

从CVE-2023-17233漏洞挖掘到批量自动化渗透测试实战在Web安全领域，路径遍历（Path Traversal）是一种经典的漏洞类型，其原理在于应用程序未对用户输入的文件路径参数进行充分验证和规范化，导致攻击者可以通过构造包含“../”等序列的输入，访问预期目录之外的文件系统。这种漏洞的技术价值在于，它往往能直接导致敏感信息泄露，例如读取系统配置文件、应用程序源码或数据库凭证，为后续的权限提升和内网横向移动提供关键跳板。在诸如校园网、企业OA等由标准化产品构成的网络环境中，特定厂商的特定系统（如锐捷自助服务平台）一旦被曝出此类漏洞，其影响范围往往非常广泛。这便阅读详情

SpringBoot+Vue中实现文件上传（图片）

1、导入依赖

<dependency>
	<groupId>cn.hutool</groupId>
	<artifactId>hutool-all</artifactId>
	<version>5.7.3</version>
</dependency>

2、编写Controller上传接口

@Value("${server.port}")
private String port;

private static final String ip="http://localhost";
/**
 * 上传接口
 * @param file
 * @return editor/upload
 * @throws IOException
 */
@PostMapping("/upload")
public Result<?> upload(MultipartFile file) throws IOException {
    String originalFilename = file.getOriginalFilename();  // 获取源文件的名称
    // 定义文件的唯一标识（前缀）
    String flag = IdUtil.fastSimpleUUID();
    String rootFilePath = System.getProperty("user.dir") + "/files/" + flag + "_" + originalFilename;  // 获取上传的路径
    FileUtil.writeBytes(file.getBytes(), rootFilePath);  // 把文件写入到上传的路径
    return Result.success(ip + ":" + port + "/files/" + flag);  // 返回结果 url
    //return Result.success();
}

3、编写Controller下载接口

/**
* 下载接口
* @param flag
* @param response
*/
@GetMapping("/{flag}")
public void getFiles(@PathVariable String flag,HttpServletResponse response) {
	OutputStream os;  // 新建一个输出流对象
	String basePath = System.getProperty("user.dir") + "/files/";  // 定于文件上传的根路径
	List<String> fileNames = FileUtil.listFileNames(basePath);  // 获取所有的文件名称
	String fileName = fileNames.stream().filter(name -> name.contains(flag)).findAny().orElse("");  // 找到跟参数一致的文件
	try {
	    if (StrUtil.isNotEmpty(fileName)) {
	        response.addHeader("Content-Disposition", "attachment;filename=" + URLEncoder.encode(fileName, "UTF-8"));
	        response.setContentType("application/octet-stream");
	        byte[] bytes = FileUtil.readBytes(basePath + fileName);  // 通过文件的路径读取文件字节流
	        os = response.getOutputStream();   // 通过输出流返回文件
	        os.write(bytes);
	        os.flush();
	        os.close();
	    }
	} catch (Exception e) {
	    System.out.println("文件下载失败");
	}
}

4、在vue界面中显示
1)、上传

<el-form-item label="封面" >
    <el-upload ref="upload" action="http://localhost:6060/singer/upload" :on-success="filesUploadSuccess">
        <el-button  type="primary">点击上传</el-button>
    </el-upload>
</el-form-item>

2)、上传成功后清除显示的文件

methods: {
    filesUploadSuccess(res){
         console.log(res);
         this.form.pic=res.pic;
     },
     add(){
         this.dialogVisible=true;
         this.form={};
         if(this.$refs['upload']){
             this.$refs['upload'].clearFiles();//清空历史文件列表
         }
     }
}

3)、显示

<el-table-column label="封面">
    <template #default="scope">
        <el-image
                style="width: 100px;height: 100px"
                :src="scope.row.pic"
                :preview-src-list="[scope.row.pic]">

        </el-image>
    </template>
</el-table-column >