html5移动端调用手机相册和相机
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html5移动端调用手机相册和相机相关的知识，希望对你有一定的参考价值。
那位大神分享一个html5调用手机端相机和相册的方法，感激不尽啊
参考技术A 需要加载cordova.js方法：
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady()
pictureSource = navigator.camera.PictureSourceType;
destinationType = navigator.camera.DestinationType;
//相册
function fromCamera()
var source = pictureSource.PHOTOLIBRARY;
navigator.camera.getPicture(function (imageData)
setimg(imageData);
, function (message)
if (source == pictureSource.CAMERA)
alert('加载照相机出错!' + message);
else
alert('加载相册出错!' + message);
,
quality: 50,
destinationType: destinationType.FILE_URI,
sourceType: source
);
//拍照
function EditImgPz()
navigator.camera.getPicture(function (imageData)
setimg(imageData);
, function (message)
alert(message);
,
quality: 50,
destinationType: navigator.camera.DestinationType.FILE_URI,
sourceType: Camera.PictureSourceType.CAMERA,
allowEdit: true,
encodingType: Camera.EncodingType.JPEG,
popoverOptions: CameraPopoverOptions,
saveToPhotoAlbum: true
);
追问
这个我试过，不行啊
移动端上传照片
我只想说这两天遇到这个图片上传的坎，差点就想砍人了。遇到了很多很多问题：比如传给后台的base64URL过大，导致页面失控自动关闭；比如传给后台的图片地址总是为空等。试了很多方法，总是出现反反复复的问题。
最后找到了一个比较方便，代码量比较少，应用比较简单的插件，在这里我要感谢作者，虽然不知道是谁。
应用场景：移动端管调用手机相册和相机，上传图片给接口进行识别
插件下载百度云地址：链接: https://pan.baidu.com/s/1YgMVGbOGUcb22P3SBstJLA 密码: 95ma
文本代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
< a href=" " class="fr mr1 upfile-btn" -id="JS-showTips">
拍行驶证自动填写<input id="upLicense" type="file" name="upLicense" capture="camera" accept="image/*">
</ a>
</body>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="ajaxfileupload.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(‘#upLicense‘).bind(‘change‘, function () {
$.ajaxFileUpload({
url: ‘/wap/insurance-licenserecon.html‘,//处理图片脚本
secureuri: false,
type: ‘post‘,
data: {img: ‘upLicense‘, type: ‘6‘},
fileElementId: ‘upLicense‘,//file控件id
dataType: ‘json‘,
success: function (json, status) {
}
})
})
</script>
</html>
以上是关于html5移动端调用手机相册和相机的主要内容，如果未能解决你的问题，请参考以下文章