1、ajax和vue的axios上传的原理基本一致，这里只介绍axios
2、首先要选择一张图片，简单布下静态页面
这里的选择图片按钮点击弹出这个选择框，事实上是在微博的发布图片上找的灵感，大家可以去看看按F12查看他的点击按钮出现的布局，本人这里采用了
宽高设置和你的按钮一样的大小，让他定位到按钮上面，opacity隐藏，就能实现点击出现选择文件窗口，当然input里面也要做一些设置
还需要一个canvas标签来转换成base64的图片格式，需要注意：
①、宽高必须写在行间样式上，其他不做要求
②、宽高最好和你截取的矩形框一样大，否则他获取出来的base64是以你canvas宽高来的，就会出现这样的情况，只有左上角一部分
头像就变成这样了
前端设置：
后台node设置：新建这样的文件，复制粘贴代码
数据库设置：
base64用长文本类型来装
前端代码：
后台代码：
直接在app.js中写
因为是formdata发的后台就要用multer来接受
model层写这里就行了
以上操作后就能实现上传头像，更换用户头像了
对了，用户可以在地址栏存着
取的时候一个正则表达式即可
网友评论