face-cartoon代码
'use strict';
exports.main = async (event, context) => {
console.log("event",event)
//event为客户端上传的参数
// Depends on tencentcloud-sdk-nodejs version 4.0.3 or higher
const tencentcloud = require("tencentcloud-sdk-nodejs-ft");
const FtClient = tencentcloud.ft.v20200304.Client;
// 实例化一个认证对象，入参需要传入腾讯云账户 SecretId 和 SecretKey，此处还需注意密钥对的保密
// 代码泄露可能会导致 SecretId 和 SecretKey 泄露，并威胁账号下所有资源的安全性。以下代码示例仅供参考，建议采用更安全的方式来使用密钥，请参见：https://cloud.tencent.com/document/product/1278/85305
// 密钥可前往官网控制台 https://console.cloud.tencent.com/cam/capi 进行获取
const clientConfig = {
credential: {
secretId: "AKIDxz20qYBi7OrAZzPerAOSNJApbJ7qR4mQ",
secretKey: "oNhnhQwDG6j8OTLzNZZLwMfx2sfFbjmh",
},
region: "ap-beijing",
profile: {
httpProfile: {
endpoint: "ft.tencentcloudapi.com",
},
},
};
// 实例化要请求产品的client对象,clientProfile是可选的
const client = new FtClient(clientConfig);
const params = {
"Url": event.Url
};
const img_base = client.FaceCartoonPic(params).then(
(data) => {
console.log("data",data);
return data
},
(err) => {
console.error("error", err);
}
);
//返回数据给客户端
return img_base
};
前端页面
<template>
<view class="container">
<view class="img_create">
<img mode="scaleToFill" :src="img_base" />
</view>
<view class="btn">
<button class="mini-btn" type="primary" size="mini" @tap="imageUpload">上传图片</button>
<button class="mini-btn" type="warn" size="mini" @click="download">下载图片</button>
</view>
<ad unit-id="adunit-7dd03658ef466a2c" ad-type="video" ad-theme="white" bindload="adLoad" binderror="adError"
bindclose="adClose"></ad>
</view>
</template>
<script>
export default {
data() {
return {
img_base: 'https://mp-7adc7bdd-1455-4caf-bb14-bf1e145956b2.cdn.bspapp.com/cloudstorage/61ffaf10-a591-4322-a9f5-ded01a8284d9.jpg',
filePath: ''
}
},
//广告加载
adLoad() {
console.log('视频广告 广告加载成功')
},
adError(err) {
console.error('视频广告 广告加载失败', err)
},
adClose() {
console.log('视频广告 广告关闭')
},
methods: {
//下载图片
download() {
const url = this.img_base
uni.showLoading({
title: '加载中...'
});
//uni.downloadFile方法：下载文件资源到本地
uni.downloadFile({
url: url, //图片完整地址 此处需自己手动修改为自己的图片地址
success: function(res) {
//uni.saveImageToPhotosAlbum方法：保存图片到系统相册
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath, //图片文件路径
success: function(data) {
uni.hideLoading(); //隐藏 loading 提示框
uni.showModal({
title: '提示',
content: '保存成功',
modalType: false,
})
},
// 接口调用失败的回调函数
fail: function(err) {
if (err.errMsg === "saveImageToPhotosAlbum:fail:auth denied" || err
.errMsg === "saveImageToPhotosAlbum:fail auth deny" || err
.errMsg === "saveImageToPhotosAlbum:fail authorize no response"
) {
uni.showModal({
title: '提示',
content: '需要您授权保存相册',
modalType: false,
success: modalSuccess => {
uni.openSetting({
success(settingdata) {
console.log("settingdata",
settingdata)
if (settingdata
.authSetting[
'scope.writePhotosAlbum'
]) {
uni.showModal({
title: '提示',
content: '获取权限成功,再次点击图片即可保存',
modalType: false,
})
} else {
uni.showModal({
title: '提示',
content: '获取权限失败，将无法保存到相册哦~',
modalType: false,
})
}
},
fail(failData) {
console.log("failData",
failData)
},
complete(finishData) {
console.log("finishData",
finishData)
}
})
}
})
}
},
complete(res) {
uni.hideLoading(); //隐藏 loading 提示框
}
})
}
})
},
saveImage() {
let imageName = Date.parse(new Date())
if (this.saveImageBase == null) {
uni.showToast({
title: '请先转换图片',
icon: "none",
duration: 5000
})
} else {
let filePath = uni.env.USER_DATA_PATH + '/' + imageName + '.png'
let data = this.saveImageBase //写入的文本或二进制数据
uni.getFileSystemManager().writeFile({
filePath: filePath, //创建一个临时文件名
data: data, //写入的文本或二进制数据
encoding: 'base64', //写入当前文件的字符编码
success: res => {
uni.saveImageToPhotosAlbum({
filePath: filePath,
success: function(res) {
console.log(res);
uni.hideLoading();
uni.showToast({
title: '保存成功',
icon: "none",
duration: 5000
})
},
fail: function(err) {
uni.hideLoading();
// console.log(err.errMsg);
}
})
},
fail: err => {
uni.hideLoading();
//console.log(err)
}
})
}
},
//upload image
imageUpload() {
var that = this
uni.chooseImage({
count: 1, //默认9
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
sourceType: ['album'], //从相册选择
success(res) {
uni.showLoading({
title: '制作中...',
mask: true
});
let filePath = res.tempFilePaths[0]
that.filePath = res.tempFilePaths[0]
uniCloud.uploadFile({
filePath: filePath,
cloudPath: 'imname.jpg',
onUploadProgress: function(progressEvent) {
console.log(progressEvent);
var percentCompleted = Math.round(
(progressEvent.loaded * 100) / progressEvent.total
);
},
success(res) {
console.log('上传成功', res.fileID);
that.getResult(res.fileID)
},
fail(err) {
console.log(err);
uni.hideLoading()
},
complete() {
}
});
}
});
},
//请求图片制作
async getResult(e) {
uniCloud.callFunction({
name: 'face-cartoon',
data: {
Url: e
}
})
.then(res => {
uni.hideLoading()
//拼接base64
this.img_base = "data:image/png;base64," + res.result.ResultImage
});
}
},
}
</script>
<style lang="scss">
.container {
padding: 20px;
font-size: 14px;
line-height: 24px;
.img_create {
display: flex;
justify-content: center;
img {
width: 98%;
border-radius: 15rpx;
box-shadow: 0rpx 2rpx 2rpx 2rpx rgba(0, 0, 0, 0.3)
}
margin-bottom: 50rpx;
}
.btn {
margin-bottom: 50rpx;
display: flex;
justify-content: space-around;
}
}
</style>
