从百度找了各种方案都是从相册选取图片压缩,就找不到拍照直接压缩的苦恼了好久
下面上代码,自己引一下jquery直接就可以用的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
img{
width: 500px;
height: 500px;
}
button{
width: 100px;
height: 50px;
margin: 0 auto;
}
</style>
</head>
<body>
<img id="x" src="" alt="" />
<button id="btn">拍照</button>
<script src="js/jquery.js"></script>
<script>
// 拍照添加文件
var btn = document.getElementById("btn");
btn.onclick = function(){
console.log(1212)
getImage()
}
function getImage() {
var cmr = plus.camera.getCamera();
cmr.captureImage(function(p) {
plus.io.resolveLocalFileSystemURL(p, function(entry) {
var localurl = entry.toLocalURL(); //把拍照的目录路径,变成本地url路径,例如file:///........之类的。
appendFile(localurl);
});
});
}
// 从相册添加文件 function appendByGallery(){plus.gallery.pick(function(path){appendFile(path);//处理图片的地方 });}
// 添加文件
var f1 = null;
function appendFile(path) {
var img = new Image();
img.src = path; // 传过来的图片路径在这里用。
var initSize = img.src.length;
img.onload = function() {
var that = this;
//生成比例
var w = that.width,
h = that.height,
scale = w / h;
w = 480 || w; //480 你想压缩到多大,改这里
h = w / scale;
//生成canvas
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
$(canvas).attr({
width: w,
height: h
});
ctx.drawImage(that, 0, 0, w, h);
var base64 = canvas.toDataURL('image/jpeg', 0.3); //1最清晰,越低越模糊。有一点不清楚这里明明设置的是jpeg。弹出 base64 开头的一段 data:image/png;却是png。哎开心就好,开心就好
// alert(base64);
f1 = base64; // 把base64数据丢过去,上传要用。
var pic = document.getElementById("x");
pic.src = base64; //这里丢到img 的 src 里面就能看到效果了
}
}
</script>
</body>
</html>