//引入Plupload 、qiniu.js后 var uploader = Qiniu.uploader({ runtimes: 'html5,flash,html4', //上傳模式,依次退化 browse_button: 'pickfiles', //上傳選擇的點選按鈕,**必需** uptoken:getTokenMessage().token, // uptoken_url: getToken(), //Ajax請求upToken的Url,**強烈建議設置**(服務端提供) // uptoken : '', //若未指定uptoken_url,則必須指定 uptoken ,uptoken由其他程序生成 // unique_names: true, // 默認 false,key為文件名。若開啟該選項,SDK為自動生成上傳成功后的key(文件名)。 // save_key: true, // 默認 false。若在服務端生成uptoken的上傳策略中指定了 `sava_key`,則開啟,SDK會忽略對key的處理 domain: 'http://qiniu-plupload.qiniudn.com/', //bucket 域名,下載資源時用到,**必需** get_new_uptoken: false, //設置上傳文件的時候是否每次都重新獲取新的token container: 'container', //上傳區域DOM ID,默認是browser_button的父元素, max_file_size: '100mb', //最大文件體積限制 flash_swf_url: 'Moxie.swf', //引入flash,相對路徑 max_retries: 3, //上傳失敗最大重試次數 dragdrop: true, //開啟可拖曳上傳 drop_element: 'container', //拖曳上傳區域元素的ID,拖曳文件或文件夾后可觸發上傳 chunk_size: '4mb', //分塊上傳時,每片的體積 auto_start: false, //選擇文件后自動上傳,若關閉需要自己綁定事件觸發上傳 init: { 'FilesAdded': function(up, files) { plupload.each(files, function(file) { // 文件添加進隊列后,處理相關的事情 console.log(file.name); }); }, 'BeforeUpload': function(up, file) { // 每個文件上傳前,處理相關的事情 }, 'UploadProgress': function(up, file) { // 每個文件上傳時,處理相關的事情 }, 'FileUploaded': function(up, file, info) { // 每個文件上傳成功后,處理相關的事情 // 其中 info 是文件上傳成功后,服務端返回的json,形式如 // { // "hash": "Fh8xVqod2MQ1mocfI4S4KpRL6D98", // "key": "gogopher.jpg" // } // 參考http://developer.qiniu.com/docs/v6/api/overview/up/response/simple-response.html // var domain = up.getOption('domain'); // var res = parseJSON(info); // var sourceLink = domain + res.key; 獲取上傳成功后的文件的Url }, 'Error': function(up, err, errTip) { //上傳出錯時,處理相關的事情 }, 'UploadComplete': function() { //隊列文件處理完畢后,處理相關的事情 }, 'Key': function(up, file) { // 若想在前端對每個文件的key進行個性化處理,可以配置該函數 // 該配置必須要在 unique_names: false , save_key: false 時才生效 var key = "12.png"; // do something with key here return key } } }); // domain 為七牛空間(bucket)對應的域名,選擇某個空間后,可通過"空間設置->基本設置->域名設置"查看獲取 // uploader 為一個plupload對象,繼承了所有plupload的方法,參考http://plupload.com/docs function getTokenMessage() { var token = {}; $.ajax({ url:your serverUrl async:false, success:function (data) { var obj = JSON.parse(data); token.token = obj.uploadToken; token.filename = obj.filename; } }) return token; } document.getElementById('uploadfiles').onclick = function() { uploader.start(); }; |