七牛云上传图片

前端
1）引入js等文件

<#--引入bootstrap的文件上传工具-->
      <link rel="stylesheet" href="../../${ctx}/css/fileinput.min.css"></link>
      <script type="text/javascript" src="../../${ctx}/js/fileinput.js"></script>
      <!-- 对中文的支持 -->
      <script type="text/javascript" src="../../${ctx}/js/fileinput_locale_zh.js"></script>

${ctx}相当于根路径，上面引入的文件放在相应路径下

2）引入上传工具

 <#--bootstrap文件上传工具-->
    <form enctype="multipart/form-data">
    <input id="file-goods-category" class="file" name="file" type="file" data-min-file-count="1">
    </form>

3）添加文件上传js代码

<script>
 /**
     * 初始设置
     *  language指定语言
     *  uploadUrl指定文件上传的后台地址
     *  allowedPreviewTypes允许上传文件的类型
     */
    $('#file-goods-category').fileinput({
        language: 'zh',
        uploadUrl: '${ctx}/fileUpload/upload',
        allowedPreviewTypes: ['image', 'html', 'text', 'video', 'audio', 'flash']
    });
    /**
     * 文件上传成功后 调用方法（回调函数）
     */
    $('#file-goods-category').on('fileuploaded', function (event, data, previewId, index) {
        var form = data.form,
            files = data.files,
            extra = data.extra,
            response = data.response,
            reader = data.reader;
        // 服务器文件地址
        // alert(data.response.fileUrl);
        // 将服务器文件地址设置至隐藏域
        $("#image").val(data.response.fileUrl);
        console.log('File uploaded triggered');
    });

    /**
     * 上传文件失败后 调用方法（回调函数）
     */
    $('#file-goods-category').on('fileuploaderror', function (event, data, previewId, index) {
        var form = data.form,
            files = data.files,
           extra = data.extra,
            response = data.response,
            reader = data.reader;
        console.log(data);
        console.log('File upload error');
    });
    /**
     * 文件错误 比如文件类型错误 调用方法（回调函数）
     */
    $('#file-goods-category').on('fileerror', function (event, data) {
        console.log(data.id);
        console.log(data.index);
        console.log(data.file);
        console.log(data.reader);
        console.log(data.files);
    });
    </script>

后端
controller层

@RestController
@RequestMapping("/fileUpload")
public class UpLoadController {
    @Autowired
    private UpLoadService upLoadService;
    @RequestMapping("/upload")
    public FileResult upload(MultipartFile file) throws IOException {
        String filename = file.getOriginalFilename();
        String date = DateTimeFormatter.ofPattern("yyyy/MM/dd").format(LocalDateTime.now());
        filename=date+System.currentTimeMillis()+filename.substring(filename.lastIndexOf("."));
        return upLoadService.upload(file.getInputStream(),filename);
    }
}

service层

@Service
public class UpLoadServiceImpl implements UpLoadService {
    /**
     * 以数据流的形式上传文件
     * @param inputStream
     * @param fileName
     * @return
     */
    @Override
    public FileResult upload(InputStream inputStream, String fileName) {
        FileResult fileResult = new FileResult();
        //构造一个带指定 Region 对象的配置类
        Configuration cfg = new Configuration(Region.region1());
//...其他参数参考类注释
        UploadManager uploadManager = new UploadManager(cfg);
//...生成上传凭证，然后准备上传
        String accessKey = "******************";
        String secretKey = "******************";
        String bucket = "syjava";//上传空间名称
//默认不指定key的情况下，以文件内容的hash值作为文件名
        String key = fileName;
        String result = null;
        try {

            Auth auth = Auth.create(accessKey, secretKey);
            String upToken = auth.uploadToken(bucket);
            try {
                Response response = uploadManager.put(inputStream,key,upToken,null, null);
                //解析上传成功的结果
               if(response.statusCode==200){
                   fileResult.setSuccess("success");
                   fileResult.setMessage("上传成功");
                   fileResult.setFileUrl("http://qtyqsgk0m.hb-bkt.clouddn.com/"+fileName);
                   return fileResult;
               }else {
                   fileResult.setError("error");
                   fileResult.setMessage("上传失败");
                   return fileResult;
               }
            } catch (QiniuException ex) {
                Response r = ex.response;
                System.err.println(r.toString());
                fileResult.setError("error");
                fileResult.setMessage("上传失败");
                try {
                    System.err.println(r.bodyString());
                } catch (QiniuException ex2) {
                    //ignore
                }
            }
        } catch (Exception e) {
            //ignore
        }
        return fileResult;
}
}

访问localhost:8080/upload测试