uniapp微信小程序换头像,MySQL后端用Springboot
时间: 2024-02-01 19:12:45 浏览: 110
uniapp微信小程序使用Echarts组件
要实现 uniapp 微信小程序的头像更换功能,可以通过以下步骤来完成:
1. 在小程序中调用微信的 `chooseImage` 接口,获取用户选择的图片文件,并将其转为 base64 编码的字符串格式。
2. 将 base64 编码的字符串发送到后端 Springboot 服务器,使用 `Base64.decodeBase64` 方法将其解码为字节数组。
3. 将字节数组转为文件,保存到服务器本地的文件系统中。
4. 将文件的保存路径和用户的信息(如用户 ID)存入 MySQL 数据库中。
5. 当用户需要查看自己的头像时,从数据库中获取头像文件的路径,将其读取为字节数组,然后将其转为 base64 编码的字符串返回给小程序。
具体实现可以参考以下代码:
在 uniapp 中实现选择图片并发送到后端服务器:
```javascript
//uniapp 选择图片并转为 base64 字符串
uni.chooseImage({
count: 1,
success: function (res) {
let tempFilePaths = res.tempFilePaths;
uni.getFileSystemManager().readFile({
filePath: tempFilePaths[0],
encoding: 'base64',
success: function (result) {
let base64 = result.data;
//发送请求到后端服务器
uni.request({
url: 'http://localhost:8080/upload',
method: 'POST',
header: {
'content-type': 'application/json'
},
data: {
image: base64
},
success: function (res) {
console.log(res);
},
fail: function (res) {
console.log("上传失败");
}
})
},
fail: function (e) {
console.log(e);
}
})
}
})
```
在 Springboot 中实现接收并保存图片:
```java
@RestController
public class ImageController {
@PostMapping(value = "/upload")
public String uploadImage(@RequestBody Map<String, String> requestMap) {
String base64 = requestMap.get("image");
//将 base64 编码的字符串转为字节数组
byte[] bytes = Base64.decodeBase64(base64);
//将字节数组转为文件,保存到服务器本地的文件系统中
String filePath = "/path/to/save/image";
try {
FileOutputStream fos = new FileOutputStream(filePath);
fos.write(bytes);
fos.flush();
fos.close();
} catch (Exception e) {
e.printStackTrace();
}
//将文件的保存路径和用户信息存入 MySQL 数据库中
String userId = "123456";
String sql = "INSERT INTO user (user_id, avatar_path) VALUES (?, ?)";
try {
Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/test", "root", "123456");
PreparedStatement pstmt = conn.prepareStatement(sql);
pstmt.setString(1, userId);
pstmt.setString(2, filePath);
pstmt.executeUpdate();
pstmt.close();
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
return "success";
}
}
```
在 Springboot 中实现获取用户头像并返回 base64 字符串:
```java
@RestController
public class ImageController {
@GetMapping(value = "/avatar/{userId}")
public String getAvatar(@PathVariable("userId") String userId) {
String sql = "SELECT avatar_path FROM user WHERE user_id = ?";
String filePath = "";
try {
Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/test", "root", "123456");
PreparedStatement pstmt = conn.prepareStatement(sql);
pstmt.setString(1, userId);
ResultSet rs = pstmt.executeQuery();
if (rs.next()) {
filePath = rs.getString("avatar_path");
}
rs.close();
pstmt.close();
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
//将头像文件读取为字节数组并转为 base64 编码的字符串
String base64 = "";
try {
FileInputStream fis = new FileInputStream(filePath);
byte[] bytes = new byte[fis.available()];
fis.read(bytes);
fis.close();
base64 = Base64.encodeBase64String(bytes);
} catch (Exception e) {
e.printStackTrace();
}
return base64;
}
}
```
阅读全文