圖片不需要直接上傳到自己本地服務，需要先上傳到七牛雲，獲取到訪問地址，把圖片的訪問地址上傳到服務器就ok了！
運行demo如下：
<script>
export default {
name: 'index',
data () {
return {
uploadToken:"",
uploadKey:"",
baseUrl:"http://images.xxxx.cn/",
}
},
methods:{
getQiniuToken(){
console.log(localStorage.getItem('token'));
this.user_http_post('/sys/qnuptoken', this.post)
.then(data => {
var data = data.data;
this.uploadToken = data.uploadToken;
this.uploadKey = data.uploadKey;
})
.catch(failure => {
});
},
ajsjd(){
var formData = new FormData();
formData.append("file", document.getElementById("file1").files[0]);
formData.append("key",this.uploadKey);
formData.append("token",this.uploadToken);
var thit = this;
$.ajax({
url: "http://upload.qiniup.com/",
type: "POST",
data: formData,
/**
*必須false才會自動加上正確的Content-Type
*/
contentType: false,
/**
* 必須false才會避開jQuery對 formdata 的默認處理
* XMLHttpRequest會對 formdata 進行正確的處理
*/
processData: false,
success: function (data) {
console.log("上傳成功：文件訪問地址：",thit.baseUrl+data.key);
},
error: function () {
alert("上傳失敗！");
$("#imgWait").hide();
}
});
}
},
computed:{
},
mounted () {
this.getQiniuToken();
}
}
</script>
<template>
<div style="width: 300px;height: 300px;">
選擇文件:<input type="file" id="file1" @change="ajsjd"/>
</div>
</template>