vue+axios OSS上傳阿里雲
阿新 • • 發佈:2019-02-04
Vue上傳檔案到阿里雲總結:
html:
<input type="file" @change="upload"/>
js:
import axios from 'axios'; import OSS from 'ali-oss'; upload(e){ var _self = this; console.log(e.currentTarget.files[0]); var urlStr = _self.upLoadAvatarOss(e); console.log(urlStr); }, async upLoadAvatarOss(e) { var file = e.currentTarget.files[0]; var reader = new FileReader(); reader.readAsArrayBuffer(file); return new Promise((resolve, reject) => { reader.onload = function (event) { const client = new OSS({ region: '', accessKeyId: '', accessKeySecret: '', bucket: '' }); const obj =new Date().getTime(); //時間戳 const key = file.name.split('.').join(obj+'.'); // 路徑+時間戳+字尾名 var buffer = new OSS.Buffer(event.target.result); async function put() { try { let result = await client.put(key, buffer); console.log(result); let httpUrl = 'url/' + key; resolve(httpUrl) } catch (e) { reject(e); console.log(e); } } return put() } }) },