स्टॉप / क्लोज वेब कैमरा जो कि navigator.getUserMedia द्वारा खोला जाता है

Question

मैंने निम्नलिखित जावास्क्रिप्ट कोड का उपयोग करके एक वेब कैमरा खोला: navigator.getUserMedia

वेबकेम को रोकने या बंद करने के लिए कोई जावास्क्रिप्ट कोड है? सबको धन्यवाद।

Answer 1

संपादित करें

चूंकि यह उत्तर मूल रूप से पोस्ट किया गया है इसलिए ब्राउज़र एपीआई बदल गया है। .stop()अब उस स्ट्रीम पर उपलब्ध नहीं है जो कॉलबैक के लिए पास हो जाती है। डेवलपर को स्ट्रीम (ऑडियो या वीडियो) बनाने वाली पटरियों तक पहुंचना होगा और उनमें से प्रत्येक को व्यक्तिगत रूप से रोकना होगा।

यहां अधिक जानकारी: https://developers.google.com/web/updates/2015/07/mediastream-deprecations?hl=en#stop-ended-and-active

उदाहरण (उपरोक्त लिंक से):

stream.getTracks().forEach(function(track) {
  track.stop();
});

ब्राउज़र समर्थन अलग हो सकता है।

मूल उत्तर

navigator.getUserMediaआपको सफलता कॉलबैक में एक स्ट्रीम प्रदान करता है, आप .stop()रिकॉर्डिंग को रोकने के लिए उस स्ट्रीम पर कॉल कर सकते हैं (कम से कम क्रोम में, ऐसा लगता है कि एफएफ यह नहीं करता है)

Comments

मुझे लगता है कि stream.stop()क्रोम के लिए काम mediaRecorder.stop()नहीं करता है, रिकॉर्डिंग बंद कर देता है, जबकि यह ब्राउज़र द्वारा प्रदान की गई धारा को नहीं रोकता है। क्या आप इस stackoverflow.com/questions/34715357/…

— Muthu

@ मंटू, मुझे लगता है कि यह निर्भर करता है, मेरे लिए स्ट्रीम (स्टॉप) (क्रोम में) काम कर रहा है। क्योंकि मेरे पास एक वेबआरटीसी स्ट्रीम है। तो अगर आप ब्राउज़र में रिकॉर्डिंग कर रहे हैं MediaRecorder.stop () काम करेगा?

— जोहान होक्समा

हाँ, लेकिन यह एक और मुद्दा उठाता है। रिकॉर्डिंग रोकने का यह कार्य रिकॉर्डिंग के कुछ सेकंड / मिनट की अनुमति देने के बाद होना चाहिए। आप इसे कैसे नियंत्रित कर सकते हैं: रिकॉर्डिंग के डिफ़ॉल्ट समय के बाद इसे रोकने के लिए? धन्यवाद!

— इमानुला कोल्टा

यह धाराओं को रोक देता है लेकिन क्रोम पर वीडियो संकेतक अभी भी सक्रिय अनिल रीलोड बना हुआ है। क्या इसे हटाने का भी कोई तरीका है?

— साइबरसर्नोवा

@Cybersupernova क्या आपको इसके लिए कोई समाधान मिला? मुझे लगता है कि पेज रिफ्रेश काम कर सकता है

— samayo

Answer 2

इनमें से किसी भी कार्य का उपयोग करें:

// stop both mic and camera
function stopBothVideoAndAudio(stream) {
    stream.getTracks().forEach(function(track) {
        if (track.readyState == 'live') {
            track.stop();
        }
    });
}

// stop only camera
function stopVideoOnly(stream) {
    stream.getTracks().forEach(function(track) {
        if (track.readyState == 'live' && track.kind === 'video') {
            track.stop();
        }
    });
}

// stop only mic
function stopAudioOnly(stream) {
    stream.getTracks().forEach(function(track) {
        if (track.readyState == 'live' && track.kind === 'audio') {
            track.stop();
        }
    });
}

नोट: उत्तर को अपडेट किया गया था: 06/09/2020

Comments

इसके लिए धन्यवाद। मीडियास्ट्रीम.स्टॉप को अपदस्थ किया जा रहा है।

— डेन ब्राउन

@DanBrown आपका समाधान क्या है?

— वेबवैन

मैं आधिकारिक तौर पर हटाए गए और ब्राउज़र से हटाए गए फ़ीचर को पुनर्स्थापित करने के लिए एक देशी एपीआई के प्रोटोटाइप को संशोधित करने को दृढ़ता से हतोत्साहित करूंगा । यह अनियमित है और बाद में भ्रम की संभावना है। जब आपको एक स्ट्रीम में सभी ट्रैक रोकने की आवश्यकता होती है, तो बस क्यों नहीं stream.getTracks().forEach(track => { track.stop() })? या अगर आप वास्तव में शॉर्टहैंड को सही ठहराने के लिए अक्सर ऐसा कर रहे हैं, तो आप हमेशा एक सहायक फ़ंक्शन को परिभाषित कर सकते हैं stopAllTracks(stream)।

— कॉलम

Answer 3

उपयोग न करें stream.stop(), यह पदावनत है

मीडियास्ट्रीम डिप्रेसेशन्स

उपयोग stream.getTracks().forEach(track => track.stop())

Comments

बहुत बहुत धन्यवाद ,, यह पूरी तरह से ठीक काम कर रहा है, मूल्यह्रास के कारण यह लोगों को भ्रमित कर रहा है कि कौन काम कर रहा है लेकिन मार्च 2019 के अनुसार उपरोक्त समाधान क्रोम में ठीक काम कर रहा है .. 🙂

— PANKAJ NAROLA

Answer 4

एफएफ, क्रोम और ओपेरा उजागर शुरू कर दिया है getUserMediaके माध्यम से navigator.mediaDevicesमानक के रूप में अब (बदल सकता है :)

ऑनलाइन डेमो

navigator.mediaDevices.getUserMedia({audio:true,video:true})
    .then(stream => {
        window.localStream = stream;
    })
    .catch( (err) =>{
        console.log(err);
    });
// later you can do below
// stop both video and audio
localStream.getTracks().forEach( (track) => {
track.stop();
});
// stop only audio
localStream.getAudioTracks()[0].stop();
// stop only video
localStream.getVideoTracks()[0].stop();

Answer 5

अलग-अलग ब्राउज़रों के साथ वेब कैमरा वीडियो शुरू करना

ओपेरा 12 के लिए

window.navigator.getUserMedia(param, function(stream) {
                            video.src =window.URL.createObjectURL(stream);
                        }, videoError );

फ़ायरफ़ॉक्स नाइटली 18.0 के लिए

window.navigator.mozGetUserMedia(param, function(stream) {
                            video.mozSrcObject = stream;
                        }, videoError );

क्रोम 22 के लिए

window.navigator.webkitGetUserMedia(param, function(stream) {
                            video.src =window.webkitURL.createObjectURL(stream);
                        },  videoError );

अलग-अलग ब्राउज़रों के साथ वेबकैम वीडियो रोकना

ओपेरा 12 के लिए

video.pause();
video.src=null;

फ़ायरफ़ॉक्स नाइटली 18.0 के लिए

video.pause();
video.mozSrcObject=null;

क्रोम 22 के लिए

video.pause();
video.src="";

इसके साथ वेब कैमरा लाइट हर बार नीचे जाता है ...

Comments

यह केवल <video> टैग में वीडियो दिखाना बंद कर देता है, लेकिन कैमरा बंद नहीं करता है।

— जी। फुर्र

Answer 6

मान लें कि हमारे पास वीडियो टैग और आईडी में स्ट्रीमिंग वीडियो है - <video id="video"></video>तो हमें निम्नलिखित कोड होना चाहिए -

var videoEl = document.getElementById('video');
// now get the steam 
stream = videoEl.srcObject;
// now get all tracks
tracks = stream.getTracks();
// now close each track by having forEach loop
tracks.forEach(function(track) {
   // stopping every track
   track.stop();
});
// assign null to srcObject of video
videoEl.srcObject = null;

Answer 7

आप सफलता हैंडलर में लौटे स्ट्रीम ऑब्जेक्ट का उपयोग करके सीधे स्ट्रीम को समाप्त कर सकते हैं। जैसे

localMediaStream.stop()

video.src=""या nullसिर्फ वीडियो टैग से स्रोत को हटा देगा। यह हार्डवेयर जारी नहीं करेगा।

Comments

समझा। मैं इसे बाद में कोशिश करूंगा।

— शिह-एन चाउ

वास्तव में नहीं ... फ़ायरफ़ॉक्स पर काम नहीं करता है। डॉक्स ने उल्लेख किया है कि यह विधि सभी ब्राउज़रों में लागू नहीं की गई है ...

— Sdra

उपरोक्त समाधान मेरे काम नहीं आया। इसने ऐसा किया।

— स्कॉट्स

Answer 8

नीचे विधि की कोशिश करें:

var mediaStream = null;
    navigator.getUserMedia(
        {
            audio: true,
            video: true
        },
        function (stream) {
            mediaStream = stream;
            mediaStream.stop = function () {
                this.getAudioTracks().forEach(function (track) {
                    track.stop();
                });
                this.getVideoTracks().forEach(function (track) { //in case... :)
                    track.stop();
                });
            };
            /*
             * Rest of your code.....
             * */
        });

    /*
    * somewhere insdie your code you call
    * */
    mediaStream.stop();

Answer 9

यदि .stop()पदावनत कर दिया जाता है तो मुझे नहीं लगता कि हमें @MuazKhan की खुराक की तरह इसे फिर से जोड़ना चाहिए। यह इस बात का कारण है कि क्यों चीजें अपदस्थ हो जाती हैं और इसका उपयोग नहीं किया जाना चाहिए। इसके बजाय बस एक हेल्पर फ़ंक्शन बनाएं ... यहां एक अधिक es6 संस्करण है

function stopStream (stream) {
    for (let track of stream.getTracks()) { 
        track.stop()
    }
}

Comments

for (let track of stream.getTracks()) { track.stop() }

— 271314

stream.getTracks().forEach(function (track) { track.stop() })for of

— ईएस

Answer 10

चूँकि आपको स्ट्रीमिंग बंद करने के लिए पटरियों की आवश्यकता है, और आपको streamपटरियों को प्राप्त करने के लिए boject की आवश्यकता है, ऊपर मैंने जो कोड माज़ खान के उत्तर की मदद से उपयोग किया है वह इस प्रकार है:

if (navigator.getUserMedia) {
    navigator.getUserMedia(constraints, function (stream) {
        videoEl.src = stream;
        videoEl.play();
        document.getElementById('close').addEventListener('click', function () {
            stopStream(stream);
        });
    }, errBack);

function stopStream(stream) {
console.log('stop called');
stream.getVideoTracks().forEach(function (track) {
    track.stop();
});

बेशक यह सभी सक्रिय वीडियो ट्रैक्स को बंद कर देगा। यदि आपके पास कई हैं, तो आपको उसके अनुसार चयन करना चाहिए।

Answer 11

आपको सभी ट्रैक रोकने की आवश्यकता है (वेबकैम, माइक्रोफ़ोन से):

localStream.getTracks().forEach(track => track.stop());

Answer 12

HTTP पर कनेक्ट होने पर .stop () का उपयोग स्ट्रीम पर काम करता है। यह ssl (https) का उपयोग करते समय काम नहीं करता है।

Answer 13

कृपया इसे देखें: https://jsfiddle.net/wazb1jks/3/

navigator.getUserMedia(mediaConstraints, function(stream) {
    window.streamReference = stream;
}, onMediaError);

रिकॉर्डिंग बंद करें

function stopStream() {
    if (!window.streamReference) return;

    window.streamReference.getAudioTracks().forEach(function(track) {
        track.stop();
    });

    window.streamReference.getVideoTracks().forEach(function(track) {
        track.stop();
    });

    window.streamReference = null;
}

Answer 14

निम्नलिखित कोड ने मेरे लिए काम किया:

public vidOff() {

      let stream = this.video.nativeElement.srcObject;
      let tracks = stream.getTracks();

      tracks.forEach(function (track) {
          track.stop();
      });

      this.video.nativeElement.srcObject = null;
      this.video.nativeElement.stop();
  }

Answer 15

वेब कैमरा शुरू और बंद करो, (अद्यतन २०२० प्रतिक्रियाएं ६)

वेब कैमरा शुरू करें

stopWebCamera =()=>

       //Start Web Came
      if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
        //use WebCam
        navigator.mediaDevices.getUserMedia({ video: true }).then(stream => {
          this.localStream = stream;
          this.video.srcObject = stream;
          this.video.play();
        });
      }
 }

सामान्य रूप से वेब कैमरा या वीडियो प्लेबैक बंद करें

stopVideo =()=>
{
        this.video.pause();
        this.video.src = "";
        this.video.srcObject = null;

         // As per new API stop all streams
        if (this.localStream)
          this.localStream.getTracks().forEach(track => track.stop());
}

वीडियो स्ट्रीम के साथ भी वेब कैमरा फंक्शन कार्य करना बंद करें:

  this.video.src = this.state.videoToTest;
  this.video.play();

Answer 16

स्ट्रीम फॉर्म सक्सेस का संदर्भ लें

var streamRef;

var handleVideo = function (stream) {
    streamRef = stream;
}

//this will stop video and audio both track
streamRef.getTracks().map(function (val) {
    val.stop();
});

Comments

यह उत्तर मूल रूप से कई अन्य लोगों के समान है जो पहले ही दिए जा चुके हैं।

— डैन डस्केलस्क्यू

एक लंबे शॉट @DanDascalescu द्वारा नहीं। देखें, इस उदाहरण में वह स्पष्ट रूप से मानचित्र फ़ंक्शन को याद करने की अपनी क्षमता का प्रदर्शन करता है।

— चार्लीबेकविथ