AR.js摄像头前置的问题（已解决）（H5调用摄像头）

                                          AR.js摄像头前置的问题（已解决）

        终于放假了，开始搬砖。很多开发者对AR.js摄像头前置的这个问题比较苦恼，网上也有很多解决办法，但是有些过时。接下来，我们来一起解决这个问题。先看一下效果。(PS:下面的QQ摄像头图，标注反了)

         不久前，我看一片关于WebAR的文章，很棒，很基础，可以先看一看，对我后面的陈述，你也需更加明白。

        点击打开链接

        接下来，上重点。现在手机大部分都是前后双摄，做AR的话，肯定是要后置摄像头的啦，但是AR.js在谷歌浏览器中，会打开后置，而现在QQ或者微信中则会打开前置摄像头。现在让我们开看看我们如何控制使用控制使用手机的前后摄像头。

navigator.mediaDevices.enumerateDevices().then(function (devices) {
    var camreass=[];
    devices.forEach(function(e){
        console.log(e)
        if(e.kind=="videoinput")
        {
            camreass.push(e.deviceId)
        }
    })
    console.log(camreass)
    var userMediaConstraints = {
        audio: false,
        video: {
            facingMode: 'environment',
            deviceId:camreass[1],
            width: {
                ideal: _this.parameters.sourceWidth,
                // min: 1024,
                // max: 1920
            },
            height: {
                ideal: _this.parameters.sourceHeight,
                // min: 776,
                // max: 1080
            }
        }
    }

        这段代码位于AR.js的源码的55954行之后，是我修改之后的。

        那么是怎么解决的这个问题的呢，其实很简答，就是指定了deviceId（设备编号）。

        代码第一行其实会获取到手机上的多媒体设备，包括音频输入输出和视频输入输出等，具体情况要根据手机设备而定。

        我们的主要目的是获取手机后摄像头，那么我们需要把手机的视频输入设备的ID存起来，然后在进行指定即可。

        我的手机是双摄，所以会有了两个视频输入设备，也就是对应两个设备编号，而第2个设备编号就是我手机的后置摄像头的设备编号。到现在为止，已经可以解决摄像头的问题。下面我想说说，我是如何解决这个问题的。

        1.首先我是看了上面的那篇文章，获得到了一些提示，就是要指定手机的视频输入设备编号，也就是指定摄像头的前后。

        2.照着那篇文章试了一试，搞不出来，一堆的Bug。

        3.然后我想查阅API吧，看到上面文章里面的用的很多API（大多在获取摄像头这里）已经过时，然后看到它的新API。API里面并没有说明如何指定设备编号，于是我打印了devices，看到设备里面有这样的一个属性deviceId，问题就在里，然后我又查阅官方文档看到一些信息，随后我指定userMediaConstraints 中video的devicedId，然后测试几番就ok拉。

        最后我把修改后的AR.js传上来，下载地址：

        点击打开链接