文件上传(本地、OSS)

什么是文件上传:将文件上传到服务器。

文件上传-本地存储

前端

html 复制代码
<template>
<div>
    <!-- 上传文件需要设置表单的提交方式为post,并设置enctype属性、表单项的type属性设置为file -->
    <form action="http://localhost:8080/wedu/upload" method="post" enctype="multipart/form-data">
    姓名:<input type="text" name="username"><br>
    年龄:<input type="text" name="age"><br>
    头像:<input type="file" name="image"><br>
    <input type="submit" value="提交">
  </form>
</div>
</template>

<script>
export default {

}
</script>

<style>

</style>

后端

因为要构造唯一的文件名,所以先来介绍一下uuid(通用唯一识别码,例如:d98b850e-7ad7-40c7-98ac-1d4f72b67124)

java 复制代码
package org.test;

import org.junit.Test;
import org.springframework.boot.test.context.SpringBootTest;

import java.util.UUID;

@SpringBootTest
public class ApplicationTest {
    @Test
    public void testUuid(){
        for (int i = 0;i < 1000;i++){
            //调用java.util.UUID类的下述方法生成随机的UUID字符串
            String uuid = UUID.randomUUID().toString();
            System.out.println(uuid);
        }
    }
}

正式编写后端:

java 复制代码
package com.wedu.modules.ColdChainVehicleDevice.controller;

import com.wedu.common.utils.R;
import lombok.extern.slf4j.Slf4j;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;

import java.io.File;
import java.io.IOException;
import java.util.UUID;

@RestController
@Slf4j
public class FileController {
    /*
    1、什么是文件上传:将文件上传到服务器
        * 前端提交过来的文件需要使用Spring提供的 MultipartFile类型的参数 来接收,
    无论是本地存储还是OSS存储文件MultipartFile的参数名必须和前端发送文件的请求参数名相同
        * 上传过来的文件是一个临时文件,当文件上传的请求响应完毕后,这个临时文件会被删除

    2、如何将服务端接收到的文件存储起来?
        * 本地存储:在服务端,接收到上传上来的文件后,将文件存储在本地服务器磁盘中。
     */
    @PostMapping("/upload")
    public R upload(String username, Integer age, MultipartFile image) throws Exception {
        //输出日志到控制台
        log.info("文件上传:{},{},{}",username,age,image);

        //获取原始文件名
        String originalFilename = image.getOriginalFilename();

        //构造唯一的文件名(文件名不能重复,不然会覆盖)- uuid(通用唯一识别码,例如:d98b850e-7ad7-40c7-98ac-1d4f72b67124)
        int index = originalFilename.lastIndexOf(".");  //获取到原始文件名最后一个点的位置
        String extname = originalFilename.substring(index);  //截取文件名的后缀
        String newFileName = UUID.randomUUID().toString() + extname;
        log.info("新的文件名:{}",newFileName);

        //将传过来的文件存储在服务器的本地磁盘目录中(D:\Desktop\wedu)
        image.transferTo(new File("D:\\Desktop\\wedu\\" + newFileName));

        return R.ok();
    }
}

SpringBoot配置文件

java 复制代码
spring:
  servlet:
    multipart:
      max-file-size: 100MB    #配置单个文件上传的大小限制
      max-request-size: 100MB   #配置单个请求最大的文件大小限制
      enabled: true

MultipartFile接口的常用方法:

文件上传-阿里云OSS存储

阿里云

先来介绍一下阿里云,它对外提供了各种各样的云服务,如下图:

阿里云OSS

现在开始介绍阿里云OSS

使用第三方服务的通用思路

阿里云OSS-使用步骤

官方SDK编写入门程序参照:

步骤:①安装->②配置访问凭证->③找到文件/对象中的上传文件中的简单上传的上传文件流部分复制代码

阿里云OSS官方文档

阿里云OSS-集成

在web项目中使用阿里云OSS的步骤:

java 复制代码
package com.wedu.common.utils;

import com.aliyun.oss.OSS;
import com.aliyun.oss.OSSClientBuilder;
import org.springframework.web.multipart.MultipartFile;
import java.io.*;
import java.util.UUID;

/**
 * 阿里云 OSS 工具类
 */
public class AliOSSUtils {

    private String endpoint = "https://填你自己的地域节点";
    private String accessKeyId = "填你自己的accessKeyId";
    private String accessKeySecret = "填你自己的accessKeySecret";
    private String bucketName = "填你自己的存储桶名称";

    /**
     * 实现上传图片到OSS
     */
    public String upload(MultipartFile file) throws IOException {
        // 获取上传的文件的输入流
        InputStream inputStream = file.getInputStream();

        // 避免文件覆盖
        String originalFilename = file.getOriginalFilename();
        String fileName = UUID.randomUUID().toString() + originalFilename.substring(originalFilename.lastIndexOf("."));

        //上传文件到 OSS
        OSS ossClient = new OSSClientBuilder().build(endpoint, accessKeyId, accessKeySecret);
        ossClient.putObject(bucketName, fileName, inputStream);

        //文件访问路径
        String url = endpoint.split("//")[0] + "//" + bucketName + "." + endpoint.split("//")[1] + "/" + fileName;
        // 关闭ossClient
        ossClient.shutdown();
        return url;// 把上传到oss的路径返回
    }

}
java 复制代码
package com.wedu.modules.ColdChainVehicleDevice.controller;

import com.wedu.common.utils.AliOSSUtils;
import com.wedu.common.utils.R;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;

import java.io.File;
import java.io.IOException;
import java.util.UUID;

@RestController
@Slf4j
public class FileController {

    @Autowired
    private AliOSSUtils aliOSSUtils;

    @PostMapping("/upload")
    public R upload(MultipartFile image) throws IOException {
        log.info("文件上传,文件名:{}",image.getOriginalFilename());
        String url = aliOSSUtils.upload(image);  //调用阿里云OSS工具类将文件上传到阿里云OSS中
        log.info("文件上传完成,文件访问的url:{}",url);
        return R.ok().put("url",url);   //将图片上传到阿里云OSS后的url返回,用于浏览器回显展示
    }
}

最后在postman中测试成功:

相关推荐
HanhahnaH14 分钟前
Spring集合注入Bean
java·spring
未定义.22120 分钟前
电子削铅笔刀顺序图详解:从UML设计到PlantUML实现
java·软件工程·uml
雾月5537 分钟前
LeetCode 1292 元素和小于等于阈值的正方形的最大边长
java·数据结构·算法·leetcode·职场和发展
CopyLower1 小时前
在 Spring Boot 中实现 WebSockets
spring boot·后端·iphone
24k小善2 小时前
Flink TaskManager详解
java·大数据·flink·云计算
想不明白的过度思考者2 小时前
Java从入门到“放弃”(精通)之旅——JavaSE终篇(异常)
java·开发语言
.生产的驴2 小时前
SpringBoot 封装统一API返回格式对象 标准化开发 请求封装 统一格式处理
java·数据库·spring boot·后端·spring·eclipse·maven
猿周LV2 小时前
JMeter 安装及使用 [软件测试工具]
java·测试工具·jmeter·单元测试·压力测试
晨集2 小时前
Uni-App 多端电子合同开源项目介绍
java·spring boot·uni-app·电子合同
时间之城2 小时前
笔记:记一次使用EasyExcel重写convertToExcelData方法无法读取@ExcelDictFormat注解的问题(已解决)
java·spring boot·笔记·spring·excel