zoukankan      html  css  js  c++  java
  • java(SSM)上传文件到七牛云(对象存储)

    项目中会用到大量的图片和小视频,为了分担服务器压力,将文件都放在七牛云。这里的思路很简单,

    就是移动端、pc端把文件上传到服务器,服务器做一个临时缓存,保存必要的信息到数据库后,

    将文件上传到七牛云,最后删除服务器的缓存。当然,也可以直接让移动端、pc端把文件上传到七牛云,

    七牛云在返回信息给服务器,这种方法虽然更佳,但是敲起代码来有点麻烦,复杂。 

    首先我们得到七牛云官网创建属于自己的空间

    实名认证最后有大内存

    登陆官网申请账号,然后建立对象储存空间Bucket 。

    作为练习建立公开空间即可

    若建立私有的将采取支付宝授权,授权后受到如下邮件信息

    之后进入建立的空间则能看见相关信息

    前期的准备工作大致就完成了。

    本文章以Maven为Demo

    在pom.xml中我们需要引入SDK

     <!-- 七牛云 -->
        <dependency>
          <groupId>com.qiniu</groupId>
          <artifactId>qiniu-java-sdk</artifactId>
          <version>7.1.1</version>
        </dependency>

    然后我们创建一个七牛云工具类

    package com.dz147.Util;
    
    import com.qiniu.common.QiniuException;
    import com.qiniu.http.Response;
    import com.qiniu.storage.UploadManager;
    import com.qiniu.util.Auth;
    
    import java.io.IOException;
    
    public class QiniuUtil {
        //设置需要操作的账号的AK和SK
        private static final String ACCESS_KEY = "";
        private static final String SECRET_KEY = "";
    
        //要上传的空间
        private static final String bucketname = "picturestorage";
    
        //密钥
        private static final Auth auth = Auth.create(ACCESS_KEY, SECRET_KEY);
    
        //普通上传
        public void upload(String filePath, String fileName) throws IOException {
            //创建上传对象
            UploadManager uploadManager = new UploadManager();
            try {
                //调用put方法上传
                Response res = uploadManager.put(filePath, fileName, auth.uploadToken(bucketname));
                //打印返回的信息
                System.out.println(res.bodyString());
            } catch (QiniuException e) {
                Response r = e.response;
                // 请求失败时打印的异常的信息
                //System.out.println(r.toString());
                try {
                    //响应的文本信息
                    System.out.println(r.bodyString());
                } catch (QiniuException e1) {
                    //ignore
                }
            }
        }
    }

    查看密匙

    使用是这么一个思路首先前端我们传一个文件到后台(以添加图片为例)

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
        </style>
    </head>
    <body>
    <form method="post" enctype="multipart/form-data">
        选择要上传的文件:<br/>
        <input type="file" name="file" id="myFile"/><span></span>
    </form>
    <div id="bar">
        上传进度:
        <progress id="pro" value="0"></progress>
    </div>
    <input type="button" id="upLoadSub" value="上传"/>
    <div>
        <img src="" alt="GG" id="myImg" width="200" height="160"/>
    </div>
    
    </body>
    <script src="../js/jquery.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script>
    
    
        var myFile = document.getElementById("myFile");
        //绑定事件(ECMAScript6写法)
        myFile.addEventListener("change", () => {
            var file = myFile.files[0];
            //预览图片函数
            previewWithObjectURL(file);
        })
        //点击->图片上传   //axios轻量级 ajax API
        $("#upLoadSub").on("click", function () {
            var myFile = document.getElementById("myFile");
            var formData = new FormData();
            formData.append("file", myFile.files[0]);
            axios({
                method: 'post',
                url: '/addQiniu',
                data: formData
            }).then(function (response) {
                console.log(response.data);
            }).catch(console.error);
        });
    
    
        //简单的图片预览建议使用第一种方式
        //URL方式(第一种方式)src = blob:http://localhost:8080/f720711f-57e2-428f-8a47-ec59e5dbbc10
        function previewWithObjectURL(file) {
            var url = URL.createObjectURL(file);
            var reader = new FileReader();
            reader.readAsDataURL(file);
            //请求完成后,显示图片
            reader.onloadend = function (event) {
                document.getElementById("myImg").src = url;
            }
            //上传过程中动态显示进度条
            reader.onprogress = function (event) {
                if (event.lengthComputable) {
                    document.getElementById("pro").value = event.loaded / event.total;
                }
            }
        }
    </script>
    </html>

    先把文件添加到image目录里

    添加到后台服务器得到文件资源再往七牛云添加。

    //Controller部分
    @RequestMapping(value = "/addQiniu", method = RequestMethod.POST, produces = "application/json;charset=utf-8;")
        public @ResponseBody
        String qiniuyunAdd(MultipartFile file, Model model, HttpServletRequest request) {
            String realPath = request.getServletContext().getRealPath(File.separator + "imges");
            String qiniuPath = "";
            try {
                //上传文件方法返回重命名,文件名称
                String s = excels.upLoadImg(file, realPath);
                //添加成功后的绝对路径
                String thisPath = realPath + File.separator + s;
                //组合七牛云外链(七牛云生成域名+保存的文件KEY)
                qiniuPath = "http://pjv3h15g0.bkt.clouddn.com/" + s;
                QiniuUtil qiniuUtil = new QiniuUtil();
                //添加到七牛云
                qiniuUtil.upload(thisPath, s);
                System.out.println(s + ",项目文件路径:" + thisPath + ",七牛云存储路径:" + qiniuPath);
                File file1 = new File(thisPath);
                if (file1.isFile()) {
                    //删除服务器图片
                    file1.delete();
                }
            } catch (IOException e) {
                e.printStackTrace();
            }
            return qiniuPath;
        }

    服务器添加图片的相关API

     @Override
        public String upLoadImg(MultipartFile file, String path) throws IOException {
            ArrayList<String> strings = new ArrayList<>();
            if (file.isEmpty()) {
                strings.add("请选择文件!");
            }
            //得到文件的类型
            String fileType = file.getContentType();
            //第一种方式Arrays.asList("image/jpeg","image/png")
            if (!fileType.contains("image/")) {
                strings.add("只允许上传图片!");
            }
            //只允许上传的图片小于5MB
            log.info(file.getSize());
            if (file.getSize() > 1024 * 1024 * 1024 * 5) {
                strings.add("只允许上传5M的图片!");
            }
            String fileName = "";
    
            String[] formatName = getFormatName(file.getOriginalFilename());
            file.transferTo(new File(path + File.separator + formatName[0] + formatName[1] + formatName[2]));
            //得到图片的相对路径
            fileName = formatName[0] + formatName[1] + formatName[2];
    
            if (strings.size() > 0) {
                fileName = "";
                fileName = strings.get(0);
            }
            return fileName;
        }
    
        public String[] getFormatName(String fileName) {
            //设置日期格式yyyy-MM-dd
            SimpleDateFormat df = new SimpleDateFormat("_yyyyMMddHHmmss");
            // new Date()为获取当前系统时间
            String now = df.format(new Date());
            //获得文件名去掉后缀
            String prefix = fileName.substring(0, fileName.lastIndexOf("."));
            //得到文件后缀带.
            String postfix = fileName.substring(fileName.lastIndexOf("."));
            return new String[]{prefix, now, postfix};
        }

    结合自身需求的总结

  • 相关阅读:
    DrGraph软件升级:处理BUG_退出程序出错
    CB2010的一个BUG:在Win2K SP4之前的系统上会出问题
    DrGraph软件升级:WIN7下的程序BUG修正
    DrGraph软件升级:编译提速
    DrGraph软件升级:窗口背景色处理
    潜安高拍仪V2013版(1)
    「工具箱」Simple Test Model
    「游戏」Astromenace
    「游戏」Simon Tatham's Puzzles
    2011 新年目标
  • 原文地址:https://www.cnblogs.com/dzcici/p/10135324.html
Copyright © 2011-2022 走看看