使用javascript用手机拍照

Question

我正在寻找一种在我的网站上用手机/平板电脑拍照的方法，行为应该是：

• 用户单击“相机”按钮。
• 手机摄像头显示。
• 用户拍照
• 图片被存储到变量中以供将来使用

我不知道该怎么做，我听说“phonegap”框架可以做到这一点，但我无法使用它，因为我在 MVC c# 项目中。 在我看来，这很难重现，因为我怀疑网站是否有权从移动设备启动任何应用程序。

有没有办法使用 javascript 来做到这一点？有什么解决办法吗？

Answer 1

您可以使用 HTML5 getUserMedia() API，本文对此进行了说明：http://www.html5rocks.com/en/tutorials/getusermedia/intro/

请注意：并非所有浏览器都支持此功能（目前）。有关支持浏览器的详细列表，请查看此页面：http://caniuse.com/#feat=stream

Answer 2

正确的解决方案是使用

<input type="file" ...

，如其他几个堆栈溢出帖子中的回答。

例如，如果您只想启动内置相机应用程序，只需创建元素：

<input type="file" name="image" accept="image/*" capture="environment">

您可以按原样使用“文件”输入，也可以隐藏它并从另一个按钮启动它，您可以隐藏输入元素并从 javascript 调用它（例如 jQuery：

$('#inpTakePhoto#').click()

）。请注意，该事件必须由用户触发，并且不能自动触发，因为它可能会出于安全原因被阻止。

输入文件控件可以配置为仅使用相机，甚至允许用户使用

multiple

标志从其他源中进行选择。它非常强大且易于使用。

郑重声明，我陷入了

getUserMedia

的兔子洞，这对大多数人来说绝对不是正确的答案。

getUserMedia

非常适合想要开发端到端相机应用程序的开发人员。它要求开发人员实现所有主要相机功能，例如捏合变焦、切换相机，我什至不确定是否可以访问闪光灯设置。