JS 上传照片并截图

经个人验证，这个 Croppie 的确是非常的好用，没碰到兼容性问题。支持自动居中、拖动、双指缩放，导出数据的时候，可以选择多种模式及尺寸。

官网，Github

如果想上传的照片自动居中，并且正确处理 Orientation 问题，需要

enableExif: true,
enableOrientation: true

然后别忘记加载 exif.js

/*
 * el 为承载 Croppie 的元素
 * s1 预览区域的尺寸
 * s2 剪裁区域的尺寸
 * 240 / 330 是预设的剪裁区域尺寸和预览区域尺寸的比例关系
 */
s1 = el.getBoundingClientRect().width;
s2 = Math.round(s1 * (240 / 330));

basic = new Croppie(el, {
	viewport: {
		width: s2,
		height: s2
	},
	enableExif: true,
	enableOrientation: true,
	showZoomer: false
});

basic.result({
	// 共四种模式：base64、html、blob 和 rawcanvas，根据需要选择
	type: 'rawcanvas',
	// 共三种模式：'viewport'、'original' 和 { width & height }
	size: {
		width: 200,
		height: 200
	},
	format: 'jpeg',
	quality: 1,
	circle: false
}).then(function(data) {
	// ...
});