2018年11月13日星期日
随笔 笔记
1、上传文件到七牛云
注册登陆到七牛云，需要认证信息才能创建个人存储空间;
存储区域介绍
最近更新时间：2018-09-09 15:49:21
| 存储区域 |
地域简称 |
上传域名 |
| 华东 |
z0 |
服务器端上传：http(s)://up.qiniup.com |
| 华北 |
z1
扫描二维码关注公众号，回复：
4136969 查看本文章
|
服务器端上传：http(s)://up-z1.qiniup.com |
| 华南 |
z2 |
服务器端上传：http(s)://up-z2.qiniup.com |
| 北美 |
na0 |
服务器端上传：http(s)://up-na0.qiniup.com |
| 东南亚 |
as0 |
服务器端上传：http(s)://up-as0.qiniup.com |
后台上传七牛云服务:选择的是七牛云的JAVA SDK开发文档,但是没有提供前台上传七牛云的API
第一 在七牛云创建自己的存储空间
第二 创建Maven项目
不是springboot配置写的代码不影响;
这里的version指定了一个版本范围，每次更新pom.xml的时候会尝试去下载7.2.x版本中的最新版本，你可以手动指定一个固定的版本
Springboot依赖库
<!-- Spring Boot 父文件 -->
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>1.5.10.RELEASE</version>
</parent>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<!-- 热部署 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-devtools</artifactId>
<optional>true</optional>
</dependency>
<!-- 测试 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
</dependency>
<!--必须有才能编译jsp -->
<dependency>
<groupId>org.apache.tomcat.embed</groupId>
<artifactId>tomcat-embed-jasper</artifactId>
<scope>provided</scope>
</dependency>导入依赖
<dependency>
<groupId>com.qiniu</groupId>
<artifactId>qiniu-java-sdk</artifactId>
<version>[7.2.0, 7.2.99]</version>
</dependency>第三 上传代码
后台上传文件工具
package cn.itsource.utils;
import com.google.gson.Gson;
import com.qiniu.common.Zone;
import com.qiniu.http.Response;
import com.qiniu.storage.Configuration;
import com.qiniu.storage.UploadManager;
import com.qiniu.storage.model.DefaultPutRet;
import com.qiniu.util.Auth;
public class FileUploadUtils {
public static String fileUploadToQiNiu(String uploadFile,String fileName){
// 构造一个带指定Zone对象的配置类
Configuration cfg = new Configuration(Zone.zone2());
// ...其他参数参考类注释
UploadManager uploadManager = new UploadManager(cfg);
// ...生成上传凭证，然后准备上传
String accessKey = "P63Fl_oUacfVwpMGuiR826rc7byWqwqyy_OBIVm3";
String secretKey = "yL_Uk2M3b68aM96ZC2dW-F8eir0R2Vuq5vE9wItz";
String bucket = "testdemo";
// 如果是Windows情况下，格式是 D:\\qiniu\\test.png
String localFilePath =uploadFile;
// 默认不指定key的情况下，以文件内容的hash值作为文件名
String key = fileName;
Auth auth = Auth.create(accessKey, secretKey);
String upToken = auth.uploadToken(bucket);
try{
Response response = uploadManager.put(localFilePath, key, upToken);
// 解析上传成功的结果
DefaultPutRet putRet = new Gson().fromJson(response.bodyString(),
DefaultPutRet.class);
System.out.println(putRet.key);
System.out.println(putRet.hash);
}catch(Exception ex){
return "上传失败"+ex.getMessage();
}
return "上传成功";
}
}启动springboot
package cn.itsource;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class QiNiuRunApp {
public static void main(String[] args) {
SpringApplication.run(QiNiuRunApp.class, args);
}
}测试
@RunWith(SpringJUnit4ClassRunner.class)
@SpringBootTest(classes = QiNiuRunApp.class)
public class QiNiuTest {
@Test
public void testupload() throws Exception {
// 第一个参数 上传文件的位置
// 第二个上传文件的名称
String result = FileUploadUtils.fileUploadToQiNiu("C:\\画图\\io.png","my.png");
System.out.println(result);
}
}前台点击按钮上传七牛云:选择的是七牛云JavaScript SDK开发文档
注意:七牛云的官方开发文档是不完善的,有些地方需要注意;
第一 前台修改 注释不用管 可以用来测试其他功能
所需插件(放在webapp下即可)百度资源:https://pan.baidu.com/s/1bK839-RHge9y0QyfNV0GsA
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="/static/jquery.min.js"></script>
<script type="text/javascript" src="/static/plupload.full.min.js"></script>
<script type="text/javascript" src="/static/qiniu.js"></script>
</head>
<body>
<!-- 自己创建div,官方文档是没有的 -->
<div id="container">
<button id="pickfiles">上次文件</button>
<img id="imgUrl" src="/static/1.PNG" style="height: 200px; width: 200px">
</div>
</body>
<script type="text/javascript">
var uploader = Qiniu.uploader({
runtimes : 'html5,flash,html4', // 上传模式，依次退化
// 上传选择的点选按钮，必需 修改成自己的
browse_button : 'pickfiles',
// 在初始化时，uptoken，uptoken_url，uptoken_func三个参数中必须有一个被设置
// 切如果提供了多个，其优先级为uptoken > uptoken_url > uptoken_func
// 其中uptoken是直接提供上传凭证，uptoken_url是提供了获取上传凭证的地址，如果需要定制获取uptoken的过程则可以设置uptoken_func
// uptoken : '<Your upload token>', // uptoken是上传凭证，由其他程序生成
uptoken_url : '/upload/uptoken', // Ajax请求uptoken的Url，强烈建议设置（服务端提供）
// uptoken_func: function(){ // 在需要获取uptoken时，该方法会被调用
// // do something
// return uptoken;
// },
get_new_uptoken : true, // 设置上传文件的时候是否每次都重新获取新的uptoken
// downtoken_url: '/downtoken',
// Ajax请求downToken的Url，私有空间时使用，JS-SDK将向该地址POST文件的key和domain，
//服务端返回的JSON必须包含url字段，url值为该文件的下载地址
// unique_names: true, // 默认false，key为文件名。若开启该选项，JS-SDK会为每个文件自动
//生成key（文件名）
// save_key: true, // 默认false。若在服务端生成uptoken的上传策略中指定了sava_key，
//则开启，SDK在前端将不对key进行任何处理
//修改成自己的bucket域名 下载资源时用到，必需
domain : 'pi5zfw3xm.bkt.clouddn.com',
//修改成自己的div的id
container : 'container', // 上传区域DOM ID，默认是browser_button的父元素
max_file_size : '100mb', // 最大文件体积限制
flash_swf_url : 'path/of/plupload/Moxie.swf', //引入flash，相对路径
max_retries : 3, // 上传失败最大重试次数
dragdrop : true, // 开启可拖曳上传
drop_element : 'container', // 拖曳上传区域元素的ID，拖曳文件或文件夹后可触发上传
chunk_size : '4mb', // 分块上传时，每块的体积
auto_start : true, // 选择文件后自动上传，若关闭需要自己绑定事件触发上传
//x_vars : {
// 查看自定义变量
// 'time' : function(up,file) {
// var time = (new Date()).getTime();
// do something with 'time'
// return time;
// },
// 'size' : function(up,file) {
// var size = file.size;
// do something with 'size'
// return size;
// }
//},
init : {
'FilesAdded' : function(up, files) {
plupload.each(files, function(file) {
// 文件添加进队列后，处理相关的事情
});
},
'BeforeUpload' : function(up, file) {
// 每个文件上传前，处理相关的事情
},
'UploadProgress' : function(up, file) {
// 每个文件上传时，处理相关的事情
},
'FileUploaded' : function(up, file, info) {
// 每个文件上传成功后，处理相关的事情
// 其中info.response是文件上传成功后，服务端返回的json，形式如：
// {
// "hash": "Fh8xVqod2MQ1mocfI4S4KpRL6D98",
// "key": "gogopher.jpg"
// }
// 查看简单反馈
var domain = up.getOption('domain');
//var res = parseJSON(info.response);
var res=JSON.parse(info);
var sourceLink = domain + res.key;//获取上传成功后的文件的Url
//把页面图片路径从七牛云获取显示
$("#imgUrl").attr("src",sourceLink);
},
'Error' : function(up, err, errTip) {
//上传出错时，处理相关的事情
alert('上传失败',err)
},
'UploadComplete' : function() {
//队列文件处理完毕后，处理相关的事情
},
//设置文件名
'Key' : function(up, file) {
// 若想在前端对每个文件的key进行个性化处理，可以配置该函数
// 该配置必须要在unique_names: false，save_key: false时才生效
var key =guid();
// do something with key here
return key
}
}
});
// domain为七牛空间对应的域名，选择某个空间后，可通过 空间设置->基本设置->域名设置 查看获取
// uploader为一个plupload对象，继承了所有plupload的方法
//用于生成随机数
function guid() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g,
function(c) {
var r = Math.random()*16|0, v = c == 'x' ? r : (r&0x3|0x8);
return v.toString(16); }); }
</script>
</html>第二 创建一个Controller访问上传文件页面
package cn.itsource.controller;
import java.util.HashMap;
import java.util.Map;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import com.qiniu.util.Auth;
@Controller
public class IndexController {
//访问上传文件页面
@RequestMapping("/")
public String index() {
return "upload";
}
}第三 对前台请求在后台完成上传文件功能
package cn.itsource.controller;
import java.util.HashMap;
import java.util.Map;
import java.util.UUID;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import com.google.gson.Gson;
import com.qiniu.common.Zone;
import com.qiniu.http.Response;
import com.qiniu.storage.Configuration;
import com.qiniu.storage.UploadManager;
import com.qiniu.storage.model.DefaultPutRet;
import com.qiniu.util.Auth;
@Controller
@RequestMapping("/upload")
public class UploadController {
// ...生成上传凭证，然后准备上传 从yml配置文件取出
@Value("${qiniu.accessKey}")
String accessKey;
@Value("${qiniu.secretKey}")
String secretKey;
@Value("${qiniu.bucket}")
String bucket;
@Value("${qiniu.domain}")
String domain;
// 获取上传凭证
@RequestMapping("/uptoken")
@ResponseBody
public Object getUptoken() {
Auth auth = Auth.create(accessKey, secretKey);
String upToken = auth.uploadToken(bucket);
@SuppressWarnings("rawtypes")
Map<String, Object> map = new HashMap();
map.put("uptoken", upToken);
return map;
}
}第四 配置application.yml/等于application.xml,注意结构层次
#设置端口
server:
port:8080
#设置上传文件大小
spring:
http:
multipart:
maxFileSize: 100Mb
maxRequestSize: 1000Mb
#设置视图解析器
mvc:
view:
prefix: /WEB-INF/jsp/
suffix: .jsp
#日志打印
logging:
level:
cn:
itsource: DEBUG
#七牛云配置 上传凭证AccessKey，SecretKey和Bucket
qiniu:
accessKey: P63Fl_oUacfVwpMGuiR826rc7byWqwqyy_OBIVm3
secretKey: yL_Uk2M3b68aM96ZC2dW-F8eir0R2Vuq5vE9wItz
domain: http://pi5zfw3xm.bkt.clouddn.com/
bucket: testdemo