本文环境:windows7、vue2.9.6,该方法适用于所有品牌的电脑。
vue.js上传图片的方法:
1、云储存
常见的 七牛云,OSS(阿里云)等,这些云平台提供API接口,调用相应的接口,文件上传后会返回图片存储在服务器上的路径,前端获得这个路径保存下来提交给后端即可。此流程处理相对简单。
主要步骤
向后端发送请求,获取OSS配置数据
文件上传,调用OSS提供接口
文件上传完成后的文件存储在服务器上的路径
将返回的路径存值到表单对象中
2、传统文件服务器上传图片
此方法就是上传到自己文件服务器硬盘上,或者云主机的硬盘上,都是通过 formdata 的方式进行文件上传。具体的思路和云文件服务器差不多。
主要步骤
设置服务器上传路径、上传文件字段名、header、data参数等
上传成功后,返回服务器存储的路径
返回的图片路径存储到表单提交对象中
3、图片转 base64 后上传
有时候做一些私活项目,或者一些小图片上传可能会采取前端转base64后成为字符串上传。当我们有这一个需求,有一个商品轮播图多张,转base64编码后去掉data:image/jpeg;base64,将字符串以逗号的形势拼接,传给后端。我们如何来实现呢。
以上就是vue.js怎么上传图片的详细内容,更多请关注易知道|edz.cc其它相关文章!