微信小程序canvas 证件照制作

小程序制作证件照过程

利用canvas制作生活中常用的证件照，压缩图片，修改图片dpi。希望给大家带来方便。

证件照小程序制作要点

1. 上传合适的图片，方便制作证件照
2. 调用AI接口，将图像进行人像分割。这里我用的是百度AI
3. 调用人体关键点为分析图片中头部和肩部的位置信息。为后满裁剪图片提供依据
4. 利用canvas 将头部和肩部位置制作为新的证件照尺寸照片
5. 改变图片的背景颜色，生成不同要求的背景证件照
6. 导出图品前将图片修改为符合打印要求的dpi。
7. 下载最终生成好的证件照

上传合适的图片，方便制作证件照

selectImg(selectid){
  let _this = this
  let typelist = selectid === 1 ? ['camera'] : ['album']
  uni.chooseImage({
    count: 1,
    sourceType: typelist,
    success: (res)=> {
      
    }
  });
}

调用AI接口，把图像进行人像分割,分析图像中头部肩部位置信息

1. [参考链接地址] https://cloud.baidu.com/doc/BODY/s/Fk3cpyxua
   

2. 该接口中要求上传的图片格式为base64 格式，大小不超过4M. 并且需要access_token
   

3. 获取access_token 参照百度AI 的文档 https://ai.baidu.com/ai-doc/REFERENCE/Ck3dwjhhu
   

4. 定义好请求地址。和请求的请求方法

const baseUrl = 'https://picapp.gxwj123.top/prod-api/'
const baidubce = 'https://aip.baidubce.com/rest/2.0/image-classify/v1/'
export const tokenUrl = `${baseUrl}txy/zjz/token`
export const body_seg_url = `${baidubce}body_seg?access_token=`
export const body_analysis_url = `${baidubce}body_analysis?access_token=`

import {tokenUrl, body_seg_url, body_analysis_url} from './url.js'
export const request = async (url) => {
  let header = {
    'Content-Type': 'application/json',
  };
	let result = await new Promise((resolve, reject) => {
		uni.request({
      url: url,
      method: 'post',
      header: header,
      success(res) {
        if (res.statusCode == 200 && res.data.code == 200) {
          resolve(res.data.data);
        }
      },
      fail(err) {
        reject(err);
      }
    });
  });
  return result
};
export const baiduRequest = async (url, data) => {
  let header = {
    'Content-Type': 'application/x-www-form-urlencoded',
  };
	let result = await new Promise((resolve, reject) => {
		uni.request({
      url: url,
      method: 'post',
      header: header,
      data: {
        image: data.image
      },
      success(res) {
        resolve(res);
      },
      fail(err) {
        reject(err);
      }
    });
  });
  return result
};
export const getAccessToken = (data) =