使用element-ui的upload组件实现上传图片至七牛云
- vue2.4 + express4.14 + es6
- node版本在
4.0
以上(建议使用 nvm 来管理node版本) - 代码风格检查 standardjs
npm install
- 工程端口
8080
- 融合模式启动
npm start
- nodemon模式启动
npm run nodemon
- 后端配置公钥、私钥和存储空间名
- 后端构建上传上传策略用以生成uploadToken
- 后端暴露api返回uploadToken
- 前端上传文件前先调用后端api获取uploadToken
- 前端成功上传图片,获取七牛返回的图片地址
-
注:启动项目前先将accessKey、secretKey、bucketName等参数替换成七牛为您提供的对应参数
-
接口请求方式
# request url
curl --request GET \
--url 'http://localhost:8080/api/upload?fileName=123.png'
# body
{
"code": "1",
"desc": "ok",
"result": {
"bucketName": "bucket-name",
"fileName": "f90bad3c937d1dcdfc37.png",
"uploadToken": "JjO_ih1JuNJAKDT-cr5T10TSuBGyJf1"
}
}
- code
注:具体文档��参考element-ui upload�