1 Вопрос: Как открыть фронтальную камеру на Android и iOS и сделать снимок, работая с Vue.Js?

вопрос создан в Thu, May 2, 2019 12:00 AM

Я работаю над приложением PWA Vue.Js, и мне нужно сделать снимок пользователя фронтальной камерой на мобильном телефоне.

Я уже выполнил некоторую работу с кодом в своем настольном браузере, но не смог добиться успеха на мобильных устройствах.

Вот что я пробовал до сих пор:


<template>
  <div id="camera">
    <div>
      <video ref="video" id="video" width="100%" height="100%" autoplay/>
    </div>
    <div>
      <button id="snap" v-on:click="capture()">Snap Photo</button>
    </div>
    <canvas ref="canvas" id="canvas" width="100%" height="100%"/>>
  </div>
</template>
<script>

export default {
  name: 'Camera',
  data() {
    return {
      video: {},
      canvas: {},
      captures: []
    }
  },
  mounted() {
    this.video = this.$refs.video;
    if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
        navigator.mediaDevices.getUserMedia({ video: true }).then(stream => {
             video.srcObject = stream;
                video.play();
                video.onplay = function () {
                };
                this.video.play();
        });
    }
},
  methods: {
    capture() {
        this.canvas = this.$refs.canvas;
        var context = this.canvas.getContext("2d").drawImage(this.video, 0, 0, 640, 480);
        this.captures.push(canvas.toDataURL("image/webp"));
    }
}
}
</script>
<style>
    #camera {
        text-align: center;
        color: #2c3e50;
    }
    #video {
        background-color: #000000;
    }
    #canvas {
        display: none;
    }
    li {
        display: inline;
        padding: 5px;
    }
</style>

Что я должен сделать, чтобы он работал на мобильном телефоне?

    
0
1 ответ                              1                         

почему вы используете кнопку, вы следуете тегам html 5 , она будет работать:

<input type="file" accept="image/*" capture="camera" />
    
3
2019-05-02 15: 08: 08Z
источник размещен Вот