移动web怎么调用手机相机，但是不调用相册

[15823424065]

移动web怎么调用手机相机，但是不调用相册，求大神指点

[业余草]

1.你给的网页用的是 <input accept="image/*" type="file">，在IOS端点击时会提示选择图片或相机，安卓端要看浏览器对这两个属性的优化，部分浏览器会直接跳转到资源管理器，优化做得好的可以直接提示选择相册或相机。这两个属性的用法可以去w3cschool上面看看。 2.首先实现在浏览器中调用摄像头，当然用现在火的不行的html5，html5中的<video>标签，并将从摄像头获得视频作为这个标签的输入来源。实现拍照功能的html5代码：

<article>
<style scoped>
  video { transform: scaleX(-1); }
  p { text-align: center; }
</style>
<h1>Snapshot Kiosk</h1>
<section id="splash">
  <p id="errorMessage">Loading...</p>
</section>
<section id="app" hidden>
  <p><video id="monitor" autoplay></video> <canvas id="photo"></canvas>
  <p><input type=button value="📷" onclick="snapshot()">
</section>
<script>
  navigator.getUserMedia({video:true}, gotStream, noStream);
  var video = document.getElementById('monitor');
  var canvas = document.getElementById('photo');
  function gotStream(stream) {
    video.src = URL.createObjectURL(stream);
    video.onerror = function () {
      stream.stop();
    };
    stream.onended = noStream;
    video.onloadedmetadata = function () {
      canvas.width = video.videoWidth;
      canvas.height = video.videoHeight;
      document.getElementById('splash').hidden = true;
      document.getElementById('app').hidden = false;
    };
  }
  function noStream() {
    document.getElementById('errorMessage').textContent = 'No camera available.';
  }
  function snapshot() {
    canvas.getContext('2d').drawImage(video, 0, 0);
  }
</script>
</article>

经本人测试在android手机的opera浏览器浏览器下可以正常实现手机拍照功能。android手机下的google chrome浏览器还不行，自带的浏览器也测试没有通过。iphone手机的safari浏览器也是不支持的。

[业余草]

http://developer.51cto.com/art/201205/337118.htm http://down.51cto.com/data/970744 http://download.csdn.net/download/hu1991die/8095595

[15823424065]

各位给的东西在百度中很多，但是因为时间原因，所以不写原生的，写的是webapp，然后包一个壳，所以Android和iso的都要支持，html5写的只支持Android 所以不行，不过，还是谢谢大神抽空回复

[Wild&Punk]

请问用web调用相册后导航栏上的字的颜色是白色的看不清 要怎么才能修改颜色？

[htt828]

我也遇到了同样的问题 想直接调用相机实时拍照上传 静止相册选取上传 请问你解决了吗