原文链接:点击跳转
接下来讲下实现过程:
首先用到的是百度云的ai算法模块【人体分析-人体分割】。
注册地址:https://login.bce.baidu.com/?account=& amp;redirect=http%3A%2F%2Fconsole.bce.baidu.com%2Fai%2F%3F_%3D1629972109997#/ai/body/report/index~appId=2736483
注册比较简单,找到人体分析,先创建应用,根据提示填写完信息就可以了
注册完之后,会生成相应的秘钥
然后再领取下免费资源,领取之后大概30分钟左右生效,免费调用10000次
接下来就可以开工了
先获取百度云token,比较简单一个get就搞定了,会用到前面创建的百度云人体分割应用
uni.request({
url: 'https://aip.baidubce.com/oauth/2.0/token?grant_type=client_credentials&client_id=(创建应用时候的API Key)&client_secret=(创建应用时的Secret Key);
method: 'GET',
success: res => {
this.uppic(res.data['access_token'], wx.arrayBufferToBase64(aa.readFileSync(this.tempFilePaths[0])));
}
});
把本地的图片上传到百度云ai接口,用到上个接口返回的access_token,百度云会直接返回一张切割后的图,放在foreground字段,我们这边转成图片存起来
uni.request({
url: 'https://aip.baidubce.com/rest/2.0/image-classify/v1/body_seg',
method: 'POST',
header: { 'content-type': 'application/x-www-form-urlencoded' },
data: { image: pic, access_token: tk },
success: res => {
let url = 'data:image/png;base64,' + res.data.foreground;
aa.writeFile({
filePath: wx.env.USER_DATA_PATH + '/test.png',
data: url.slice(22),
encoding: 'base64',
success: res => {
this.tempFilePaths = [wx.env.USER_DATA_PATH + '/test.png'];
this.canvasImgFun();
uni.hideLoading();
uni.showToast({
title: '上传成功'
});
},
fail: err => {
console.log(err);
}
});
},
fail: res => {
console.log(res);
}
});
我们把保存后的图片直接渲染进Canvas,然后根据用户的选择生成底色,然后保存成图片
save() {
if (this.tempFilePaths[0] != wx.env.USER_DATA_PATH + '/test.png') {
uni.showToast({
title: '换色后再保存',
icon:'none'
})
return
}
uni.canvasToTempFilePath({
canvasId: 'myCanvas',
fileType: 'jpg',
success: function(res) {
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: function(res) {
uni.showToast({
title: '保存成功',
});
},
fail: function(err) {
console.log(err);
}
});
},
fail:function(err){
console.log(err)
uni.hideLoading()
}
},this)