html5怎么调用系统相机-问答-阿里云开发者社区-阿里云

开发者社区> 问答> 正文

html5怎么调用系统相机

云栖技术 2016-06-06 17:31:52 1162

html5怎么调用系统相机?现在需要开发一个支付界面调用系统相机拍照上传图片到服务器,是否可行。

移动开发 HTML5
分享到
取消 提交回答
全部回答(2)
  • wjin06
    2019-07-17 19:29:06

    可以用input标签实现,<input type='file'></input>

    0 0
  • 云栖技术
    2019-07-17 19:29:06
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
     
    <head>
     
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
     
        <title>Document</title>
     
    </head>
     
    <body>
     
            <video id="video" autoplay=""style='width:640px;height:480px'></video>
     
            <button id="picture">photo</button> 
     
            <canvas id="canvas" width="640" height="480"></canvas>
     
    </body>
     
     <script type="text/javascript">
     
       var video = document.getElementById("video");
     
       var context = canvas.getContext("2d")
     
       var errocb = function () {
     
                              console.log('sth wrong!');
     
          }
     
          if (navigator.getUserMedia) { // 标准的API
     
                    navigator.getUserMedia({ "video": true }, function (stream) {
     
                        video.src = stream;
     
                        video.play();
     
                    }, errocb);
     
     } else if (navigator.webkitGetUserMedia) { // WebKit 核心的API
     
                    navigator.webkitGetUserMedia({ "video": true }, function (stream) {
     
                        video.src = window.webkitURL.createObjectURL(stream);
     
                        video.play();
     
                    }, errocb);
     
      }
     
      document.getElementById("picture").addEventListener("click", function () {
     
                    context.drawImage(video, 0, 0, 640, 480);
     
     });
     
     </script>
     
    </html>
    0 0
添加回答

集结各类场景实战经验,助你开发运维畅行无忧

推荐文章
相似问题
推荐课程