npm地址
初始化API
import axios from 'axios'
import qs from 'qs'
const http = axios.create({
// baseURL: 'http://api-test.matixiang.com',
timeout: 1000,
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
transformRequest: [function (data) {
return qs.stringify(data)
}
],
paramsSerializer: function (data) {
return qs.stringify(data)
}
})
export default http
#在main.js引入api.js
window.$http = Vue.prototype.$http = http
文件流上传图片
# html
<form id="formid">
<label for="resource">上传文档</label>
<input type="file" id="resource" name="resource" ref="resource">
<button type="button" @click="upload()">上传</button>
</form>
JavaScript
var formData = new FormData() // FormData 对象
formData.append('file', this.$refs.resource.files[0])
this.$http.post('http://192.168.1.200:3001/api/upload/sina', formData, {
method: 'post',
headers: {
'Content-Type': 'multipart/form-data'
},
transformRequest: [function (data) {
return data
}],
onUploadProgress: function(e) {
let percentage = Math.round((e.loaded * 100) / e.total) || 0
console.log(e, percentage)
}
}).then((response) => {
if (response.data.status) {} else {
this.$Notice.error({
title: '错误',
message: response.data.imgId
})
}
}).catch(function (error) {
console.log(error)
})
参考：
太感谢了, 我花了大半天时间, 找这个axios的跨域文件上传的问题....发现得救之道, 就在你的页面中, 谢谢...
@MArc : 客气
你这个代码高亮效果很不错，用的是什么插件？
@jerry : prism.js 这个高亮库，支持自定义，用的还是蛮不错
@JaneCC : 我也用上了，比之前的效果好多了。谢谢