網(wǎng)站靜態(tài)文件存儲在又拍云，之前上傳是通過又拍云的的FORM API進(jìn)行。
當(dāng)產(chǎn)品經(jīng)理歪著腦袋走向你的時候，哎呀呀，這用戶信息這里，上傳要無刷新的效果了。
這他***，自己偷偷抱怨一會會，怎么搞喃？聽說這家伙要一個好聽的名字，異步上傳，高大上檔次挺像我的。
根據(jù)我們的觀察，此處有兩個重點：
①、怎么實現(xiàn)異步上傳
②、怎么上傳到又 拍 云
首先我們要實現(xiàn)異步上傳，就需要利用js里面的FormData對象，據(jù)說，這家伙不支持ie6 7的，ie8就不太清楚了，據(jù)說哈，說錯了不負(fù)責(zé)的。
不過喃，我們也不用考慮辣么多，前段時間都聽說淘寶都要放棄ie6 7了，so 甭考慮辣么多了。ie6 7逮著ta估計都要罵ta小婊砸，竟然敢不支持我。
FormData是誰，這里就不多介紹了，可以自行百度。
我們先來看看view層怎么使用FormData這個小婊砸
<input type="file" accept="image/jpg,image/jpeg,image/png,image/gif" id="upload"><input type="hidden" name="file">
如你所想，僅僅是一個input上傳按鈕和一個我們預(yù)留的準(zhǔn)備接收圖片地址的隱藏input
下面來看看JS是怎么憤怒的吧
<script type="text/javascript">function($){ //上傳 $("#upload").on("change", function () { //構(gòu)造FormData對象并賦值 var formData = new FormData(); formData.append("policy", "//controller層傳遞過來upYun的policy配置"); formData.append("signature", "//controller層傳遞過來upyun的signature配置"); formData.append("file", $("#upload")[0].files[0]); $.ajax({ url : "//處理上傳的后端程序地址", type : "POST", data : formData, processData : false, contentType : false, beforeSend: function () { //可以做一些正在上傳的效果 }, success : function(data) { //data，我們這里是異步上傳到后端程序所返回的圖片地址 }, error : function(responseStr) { console.log(responseStr); } }); });}($);</script> 到此，我們已經(jīng)實現(xiàn)了異步上傳的前端代碼，包括又拍云所需要的參數(shù)policy和signature
剩下的實現(xiàn)上傳到又拍云就簡單了，可以參考
https://github.com/upyun/php-sdk 進(jìn)行處理
