資訊專欄INFORMATION COLUMN
摘要：和七牛賬號里面提供。自己設(shè)定的七牛云存儲空間名，創(chuàng)建存儲空間的時(shí)候注意地區(qū)應(yīng)該默認(rèn)是華東，不一樣地區(qū)需要修改下里面指定的上傳的域名，請去參考官方文檔。若開啟該選項(xiàng)，為自動生成上傳成功后的文件名。
先放上幾個(gè)用到的七牛官方網(wǎng)站：
JavaScript SDK地址
需要在頁面中先引入 plupload 提供的 plupload.full.min.js（生產(chǎn)環(huán)境）
然后再引入SDK里的 qiniu.min.js（生產(chǎn)環(huán)境）
在線生成uptoken地址
uptoken上傳需要用到，正式項(xiàng)目一般由后臺生成，這里我們做測試，用自己的ak、sk、bucketName去官方生成一個(gè)（有時(shí)效性）。
AK和SK：七牛賬號里面提供。
bucketName：自己設(shè)定的七牛云存儲空間名，創(chuàng)建存儲空間的時(shí)候注意地區(qū)(應(yīng)該默認(rèn)是華東)，不一樣地區(qū)需要修改下qiniu.min.js里面指定的上傳的域名，請去參考官方文檔。
其它：可選的都可不填。
檢測uptoken是否可用地址(能否成功上傳)地址
token：上面生成的自己的token。
key：可以不填。
關(guān)于測試生成的token是否可用，也可以參考這個(gè)網(wǎng)站提供的demo，按他的說明修改demo里面的兩個(gè)值就可以判斷自己的token是否可用，并且有反饋，根據(jù)反饋的erro參考官方文檔。
這里要用button標(biāo)簽，然后id和js方法中Qiniu.uploader的browse_button綁定。
這里用input標(biāo)簽type="file"不行！
//引入Plupload 、qiniu.js后
var uploader = Qiniu.uploader({
runtimes: "html5,flash,html4", //上傳模式,依次退化
browse_button: "pickfiles", //上傳選擇的點(diǎn)選按鈕，**必需**
uptoken: "myToken",
//uptoken_url: "/token", //Ajax請求upToken的Url，**強(qiáng)烈建議設(shè)置**（服務(wù)端提供）
// uptoken: "", //若未指定uptoken_url,則必須指定 uptoken ,uptoken由其他程序生成
// unique_names: true, // 默認(rèn) false，key為文件名。若開啟該選項(xiàng)，SDK為自動生成上傳成功后的key（文件名）。
// save_key: true, // 默認(rèn) false。若在服務(wù)端生成uptoken的上傳策略中指定了 `sava_key`，則開啟，SDK會忽略對key的處理
domain: "myUrl", //bucket 域名，下載資源時(shí)用到，**必需**
get_new_uptoken: false, //設(shè)置上傳文件的時(shí)候是否每次都重新獲取新的token
container: "container", //上傳區(qū)域DOM ID，默認(rèn)是browser_button的父元素，
max_file_size: "100mb", //最大文件體積限制
flash_swf_url: "Moxie.swf", //引入flash,相對路徑
max_retries: 3, //上傳失敗最大重試次數(shù)
dragdrop: true, //開啟可拖曳上傳
drop_element: "container", //拖曳上傳區(qū)域元素的ID，拖曳文件或文件夾后可觸發(fā)上傳
chunk_size: "4mb", //分塊上傳時(shí)，每片的體積
auto_start: true, //選擇文件后自動上傳，若關(guān)閉需要自己綁定事件觸發(fā)上傳
init: {
"FilesAdded": function(up, files) {
plupload.each(files, function(file) {
// 文件添加進(jìn)隊(duì)列后,處理相關(guān)的事情
console.log(file.name);
});
},
"BeforeUpload": function(up, file) {
// 每個(gè)文件上傳前,處理相關(guān)的事情
},
"UploadProgress": function(up, file) {
// 每個(gè)文件上傳時(shí),處理相關(guān)的事情
},
"FileUploaded": function(up, file, info) {
// 每個(gè)文件上傳成功后,處理相關(guān)的事情
// 其中 info 是文件上傳成功后，服務(wù)端返回的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) {
//上傳出錯(cuò)時(shí),處理相關(guān)的事情
},
"UploadComplete": function() {
//隊(duì)列文件處理完畢后,處理相關(guān)的事情
},
"Key": function(up, file) {
// 若想在前端對每個(gè)文件的key進(jìn)行個(gè)性化處理，可以配置該函數(shù)
// 該配置必須要在 unique_names: false , save_key: false 時(shí)才生效
var key = "";
// do something with key here
return key
}
}
});
// domain 為七?？臻g（bucket)對應(yīng)的域名，選擇某個(gè)空間后可以看到
// uploader 為一個(gè)plupload對象，繼承了所有plupload的方法，參考http://plupload.com/docs
document.getElementById("pickfiles").onclick = function() {
uploader.start();
};
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/82158.html
摘要：是上傳到服務(wù)器的文件名，是請求令牌。七牛云將持續(xù)發(fā)布服務(wù)于企業(yè)的云服務(wù)，也會在第一時(shí)間發(fā)布平臺的，讓使用的小伙伴在第一時(shí)間集成七牛云的最新服務(wù)。 React Native 是最近兩年最值得花時(shí)間跟進(jìn)的移動開發(fā)技術(shù)，這個(gè)項(xiàng)目始于2013年Facebook內(nèi)部的一個(gè)黑客馬拉松項(xiàng)目，在2014年7月之前這個(gè)項(xiàng)目都偏向于實(shí)驗(yàn)性質(zhì)，直到廣告管理團(tuán)隊(duì)想要構(gòu)建一個(gè)獨(dú)立的iOS應(yīng)用，然而這個(gè)團(tuán)隊(duì)并沒有...
摘要：，在后續(xù)測試時(shí)遇到一個(gè)詭異，當(dāng)文件過大時(shí)，任務(wù)腳本上傳到七牛云失敗。當(dāng)我遇到大文件無法上傳到七牛云時(shí)，斷點(diǎn)調(diào)試到這里，發(fā)現(xiàn)返回的是。后來還真被我找到了，七牛云官方提供一個(gè)腳本工具。 業(yè)務(wù)場景 需求 我們項(xiàng)目有一個(gè)文件上傳需求，需要從客戶端上傳到七牛云的對象存儲和自己的應(yīng)用服務(wù)器上。這里使用七牛云主要是實(shí)現(xiàn)下載分發(fā)。應(yīng)用服務(wù)器需要留一份是因?yàn)楹罄m(xù)需要做文件分析（并且是上傳后需要立馬分析出...
摘要：原文使用七牛云存儲的一些經(jīng)驗(yàn)總結(jié)錯(cuò)誤處理如果在與七牛的交互中出現(xiàn)狀態(tài)碼為的錯(cuò)誤，一句話，不要猶豫，直接聯(lián)系七牛技術(shù)支持。但是筆者發(fā)現(xiàn)，在使用七牛云轉(zhuǎn)化后的視頻，這樣做是無效的。 近段時(shí)間將使用七牛云存儲來存放用戶上傳的數(shù)據(jù)，客戶端通過七牛的js-sdk與七牛交互，服務(wù)端C#實(shí)現(xiàn)了七牛相關(guān)的接口。在這過程中多多少少遇到點(diǎn)問題，在這里總結(jié)一下。原文：使用七牛云存儲的一些經(jīng)驗(yàn)總結(jié) 599錯(cuò)...
摘要：后來查閱了資料后自己手動實(shí)現(xiàn)了文件切片上傳到服務(wù)器基本需求已經(jīng)實(shí)現(xiàn)，但由于效率及穩(wěn)定性問題后來決定還是直傳文件到七牛云?？偨Y(jié)起來七牛云上傳的套路就是后臺為你提供或者獲取的接口地址之后上傳的時(shí)候要帶上這個(gè)。 起因 最近在工作中有個(gè)上傳大文件的需求，原先咨詢過組里的大佬給我推薦了百度的webupload，但后來引入之后發(fā)現(xiàn)它是基于jquery封裝的。由于本身項(xiàng)目是基于vue開發(fā)的所以與j...
摘要：目前可能是七牛瀏覽器文件上傳的最好實(shí)現(xiàn)。任務(wù)攔截器攔截任務(wù)返回，任務(wù)將會從任務(wù)隊(duì)列中剔除，不會被上傳中斷任務(wù)，返回，任務(wù)隊(duì)列將會在這里中斷，不會執(zhí)行上傳操作。請上傳小于的文件你可以添加多個(gè)任務(wù)攔截器選擇上傳文件確定后該生命周期函數(shù)會被回調(diào)。 qiniu4js qiniu4js目前可能是七牛JavaScript瀏覽器文件上傳的最好實(shí)現(xiàn)。 使用TypeScript編寫，不依賴任何三方庫，純...
閱讀 1971·2021-10-12 10:12
閱讀 3109·2019-08-30 15:44
閱讀 869·2019-08-30 15:43
閱讀 3015·2019-08-30 14:02
閱讀 2113·2019-08-30 12:54
閱讀 3529·2019-08-26 17:05
閱讀 2021·2019-08-26 13:34
閱讀 1076·2019-08-26 11:54
