首页 > 移动平台 > 详细

移动端调用手机摄像头拍照并上传到服务器

时间:2019-05-05 19:02:51      阅读:349      评论:0      收藏:0      [点我收藏+]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
</head>
<body>
<div>
<div>
<span type="primary" class="wrapper">
<label class="btn" for="payeePicture">拍照上传照片demo</label>
</span>
<input type="file" multiple accept="image/*" name="myPic" id="payeePicture" onchange=‘uploadVideo(obj)‘>
</div>
</div>
<script src="http://gosspublic.alicdn.com/aliyun-oss-sdk-4.4.4.min.js"></script>
<script>
function uploadVideo(obj) {
var file = document.getElementById(‘payeePicture‘).files[0];
var val = obj.value;
console.log("val",val)
var storeAs = "wx/gzh/pic/" + times() + ".jpg";
$.ajax({
url:‘http://ts.api.owikio.com:8886/WxApis/AliOss/Get‘,
type: "POST",
dataType: "json",
beforeSend: function (xhr) {
token = localStorage.getItem("token");
xhr.setRequestHeader("Authorization", token);
},
contentType: "application/json",
data: JSON.stringify({
}),
success: function (data) {
if(data.ResultType === 0 ) {
let client = new OSS.Wrapper({
// 阿里云OSS
accessKeyId: data.AppendData.accessKeyId,
accessKeySecret: data.AppendData.accessKeySecret,
stsToken:data.AppendData.securityToken,
endpoint: ‘oss-cn-hangzhou.aliyuncs.com‘,
bucket: ‘tsres‘,
});
client.multipartUpload(storeAs, file).then(function (result) {
// 回调成功的 result
}).catch(function (err) {
})
}

},
error: function(reeor){
}
})
};
function times() {
var time = new Date();
var y = time.getFullYear();
var m = time.getMonth() + 1;
var d = time.getDate();
var h = time.getHours();
var mm = time.getMinutes();
var s = time.getSeconds();
// console.log(y);
return "" + y + add0(m) + add0(d) + add0(h) + add0(mm) + add0(s);
}
function add0(m) {
return m < 10 ? ‘0‘ + m : m;
}
</script>
</body>
</html>

移动端调用手机摄像头拍照并上传到服务器

原文:https://www.cnblogs.com/xiaojiaeiyo/p/10815255.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!