বন্ধ করুন / ওয়েবক্যাম বন্ধ করুন যা নেভিগেটর.জেটউসারমিডিয়া খোলে


139

আমি নিম্নলিখিত জাভাস্ক্রিপ্ট কোড ব্যবহার করে একটি ওয়েবক্যাম খুললাম: navigator.getUserMedia

ওয়েবক্যাম বন্ধ বা বন্ধ করার জন্য কি জাভাস্ক্রিপ্ট কোড আছে? ধন্যবাদ সবাইকে.

উত্তর:


199

সম্পাদনা

যেহেতু এই উত্তরটি মূলত পোস্ট করা হয়েছে তাই ব্রাউজারের এপিআই পরিবর্তন হয়েছে। .stop()স্ট্রিমটিতে আর উপলব্ধ নেই যা কলব্যাকে চলে যায়। বিকাশকারীকে সেই ট্র্যাকগুলি অ্যাক্সেস করতে হবে যা স্ট্রিম তৈরি করে (অডিও বা ভিডিও) এবং সেগুলির প্রতিটি পৃথকভাবে বন্ধ করে দেয়।

এখানে আরও তথ্য: https://developers.google.com/web/updates/2015/07/mediastream-deprecations?hl=en#stop-end-and-active

উদাহরণ (উপরের লিঙ্ক থেকে):

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

ব্রাউজার সমর্থন পৃথক হতে পারে।

আসল উত্তর

navigator.getUserMediaসাফল্য কলব্যাকে আপনাকে একটি স্ট্রিম সরবরাহ করে, আপনি .stop()এই স্ট্রিমটিতে রেকর্ডিং বন্ধ করতে কল করতে পারেন (কমপক্ষে ক্রোমে, এফ এফ এটি পছন্দ করে না)


2
আমি মনে করি stream.stop()ক্রোমের জন্য কাজ mediaRecorder.stop()করে না, রেকর্ডিং বন্ধ করে দেয়, যেখানে এটি ব্রাউজারের সরবরাহিত স্ট্রিমটি থামায় না। আপনি কি এই স্ট্যাকওভারফ্লো.com
মুথু

@ মন্টু, আমি মনে করি এটি নির্ভর করে, আমার জন্য স্ট্রিম.স্টপ () ক্রোম করছে (ক্রোমে)। কারণ আমার একটি ওয়েবআরটিসি স্ট্রিম রয়েছে। আপনি যদি ব্রাউজারে রেকর্ডিং করেন তবে মিডিয়ারেকর্ডার.স্টপ () কাজ করবে?
জোহান হয়েকসমা

হ্যাঁ, তবে এটি আরও একটি সমস্যা উত্থাপন করে। রেকর্ডিং বন্ধ করার জন্য এই ফাংশনটি কয়েক সেকেন্ড / মিনিটের রেকর্ডিংয়ের পরে অনুমতি দেওয়া উচিত। আপনি কীভাবে এটি নিয়ন্ত্রণ করতে পারেন: রেকর্ডিংয়ের একটি ডিফল্ট সময়ের পরে এটি বন্ধ করতে? ধন্যবাদ!
ইমানুয়েলা কোল্টা

1
এটি স্ট্রিমগুলি থামিয়ে দেয় তবে ক্রোমে থাকা ভিডিও সূচকটি এখনও পুনরায় লোড সক্রিয় রাখে। এটিও সরিয়ে দেওয়ার কোনও উপায় আছে?
সাইবারসুপার্নোভা

@ সাইবারসুপার্নোভা আপনি কি এর জন্য কোনও সমাধান খুঁজে পেয়েছেন? আমি মনে করি পৃষ্ঠা
রিফ্রেশটি কার্যকর

59

এই ফাংশনগুলির কোনও ব্যবহার করুন:

// 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


2
এর জন্য ধন্যবাদ. মিডিয়াস্ট্রিম.স্টপকে অবচয় করা হচ্ছে।
ড্যান ব্রাউন

@ ড্যানব্রাউন আপনার সমাধান কী?
ওয়েবউইম

ব্রাউজার থেকে অফিসিয়ালি অবচয় এবং সরানো হয়েছে এমন কোনও বৈশিষ্ট্য পুনরুদ্ধার করতে আমি নেটিভ এপিআই এর প্রোটোটাইপ সংশোধন করার দৃ strongly়ভাবে নিরুৎসাহিত করব । এটি অনিয়মিত এবং পরে বিভ্রান্তির কারণ হতে পারে। যখন আপনাকে একটি স্ট্রিমের সমস্ত ট্র্যাকগুলি থামানোর দরকার হয়, তবে কেন কেবল করা হয় না stream.getTracks().forEach(track => { track.stop() })? বা যদি আপনি সংক্ষিপ্তর পক্ষে যুক্তিযুক্ত হওয়ার পক্ষে এটি প্রায়শই যথেষ্ট করেন তবে আপনি সর্বদা একটি সহায়ক ফাংশন সংজ্ঞায়িত করতে পারেন stopAllTracks(stream)
কলম

45

ব্যবহার করবেন না stream.stop(), এটি অবহেলা করা হয়েছে

মিডিয়াস্ট্রিম অবচয়

ব্যবহার stream.getTracks().forEach(track => track.stop())


1
আপনাকে অনেক ধন্যবাদ, এটি পুরোপুরি ঠিকঠাক কাজ করছে, অবমূল্যায়নের কারণে এটি লোককে বিভ্রান্ত করছে যে কোনটি কাজ করছে তবে মার্চ -২০১৯ এর উপরের সমাধানটি ক্রোমে ঠিকঠাকভাবে কাজ করছে .. 🙂
পঙ্কাজ নারোলা

10

মুক্তিযোদ্ধা, ক্রোম এবং অপেরা প্রকাশক শুরু করেছে getUserMediaমাধ্যমে navigator.mediaDevicesমান হিসেবে NOW (পরিবর্তন করতে পারে :)

অনলাইন ডেমো

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();

9

বিভিন্ন ব্রাউজার দিয়ে ওয়েবক্যাম ভিডিও শুরু করা

অপেরা 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 );

বিভিন্ন ব্রাউজার দিয়ে ওয়েবক্যাম ভিডিও থামানো Stop

অপেরা 12 এর জন্য

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

ফায়ারফক্স নাইটলি 18.0

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

ক্রোম 22 এর জন্য

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

এটি দিয়ে ওয়েবক্যামের আলো প্রতিটি সময় নেমে যায় ...


10
এটি কেবলমাত্র <ভিডিও> ট্যাগে ভিডিওটি দেখানো বন্ধ করে, তবে ক্যামেরাটি থামায় না।
জি ফারাহ

8

ধরুন আমাদের কাছে ভিডিও ট্যাগটিতে স্ট্রিমিং রয়েছে এবং আইডি ভিডিও - <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;

6

ইউজারমিডিয়াতে সাফল্যের হাতলটিতে ফিরে আসা স্ট্রিম অবজেক্টটি ব্যবহার করে আপনি সরাসরি স্ট্রিমটি শেষ করতে পারেন। যেমন

localMediaStream.stop()

video.src=""অথবা nullভিডিও ট্যাগ থেকে উত্সটি সরিয়ে ফেলবে। এটি হার্ডওয়ারটি ছাড়বে না।


আমি দেখি. আমি পরে এটি চেষ্টা করব।
শিহ-এন চৌ চৌ

1
আসলেই নয় ... ফায়ার ফক্সে কাজ করে না। দস্তাবেজগুলি উল্লেখ করে যে এই পদ্ধতিটি সমস্ত ব্রাউজারগুলিতে প্রয়োগ করা হয় না ...
এসড্রা

উপরের সমাধানটি আমার পক্ষে কার্যকর হয়নি। এটি এটা করেছে।
স্কটিমাস

5

নীচে পদ্ধতি চেষ্টা করুন:

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();

4

যদি .stop()এটিকে অবমূল্যায়ন করা হয় তবে আমি মনে করি না যে এটি আমাদের @ মুয়াজখান ডোজ মতো পুনরায় যুক্ত করা উচিত। এটি হ'ল কারণ কেন জিনিসগুলি হ্রাস করা হয় এবং আর ব্যবহার করা উচিত নয়। পরিবর্তে একটি সহায়ক ফাংশন তৈরি করুন ... এখানে আরও একটি এস 6 সংস্করণ রয়েছে

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

1
for (let track of stream.getTracks()) { track.stop() }
অতিথি 271314

7
stream.getTracks().forEach(function (track) { track.stop() })for of
ইএস

3

যেহেতু আপনার স্ট্রিমিং বন্ধ করার জন্য ট্র্যাকগুলি প্রয়োজন এবং ট্র্যাকগুলি পেতে আপনার প্রয়োজন হবে, streamউপরের মুয়াজ খানের উত্তরের সাহায্যে আমি কোডটি ব্যবহার করেছি:

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();
});

অবশ্যই এটি সমস্ত সক্রিয় ভিডিও ট্র্যাকগুলি বন্ধ করে দেবে। আপনার যদি একাধিক থাকে তবে আপনার সেই অনুযায়ী নির্বাচন করা উচিত।


2

আপনাকে সমস্ত ট্র্যাক বন্ধ করতে হবে (ওয়েবক্যাম, মাইক্রোফোন থেকে):

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

0

স্ট্রিমে .stop () ব্যবহার করা যখন HTTP- র মাধ্যমে সংযুক্ত থাকে তখন ক্রোমে কাজ করে। এসএসএল (https) ব্যবহার করার সময় এটি কাজ করে না।


0

দয়া করে এটি দেখুন: 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;
}


0

নিম্নলিখিত কোডটি আমার পক্ষে কাজ করেছে:

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();
  }

0

ওয়েব ক্যামেরা শুরু এবং বন্ধ করুন, (আপডেট 2020 এস-এ 6 প্রতিক্রিয়া জানুন)

ওয়েব ক্যামেরা শুরু করুন

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();

-1

হ্যান্ডল ফর্ম সাফল্যের একটি রেফারেন্স আছে

var streamRef;

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

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

1
এই উত্তরটি ইতিমধ্যে দেওয়া বেশ কয়েকটি অন্যান্যর মতো একই।
ড্যান ড্যাসক্লেস্কু

দীর্ঘ শট @ ড্যানডাসক্লেস্কু দ্বারা নয়। দেখুন, এই উদাহরণে তিনি মানচিত্রের ক্রিয়াকলাপটি পুনরায় স্মরণ করার জন্য তার ক্ষমতাটি স্পষ্টভাবে প্রদর্শন করেছেন।
Charliebeckwith
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.