4

I've been developing a web app to scan the barcode in live stream. I have used the following code for video streaming:

navigator.mediaDevices.getUserMedia({ video: constraints }).then(function(stream) {
       // video.src = window.URL.createObjectURL(stream);
       video.srcObject = stream;
       video.play();
       // ...
}

It works as expected in Android chrome browser, and also in ios safari browser. But, when i tried it in ios Chrome browser, it is not working. I have also tried adding the following constraints:

video.setAttribute('autoplay', '');
video.setAttribute('muted', '');
video.setAttribute('playsinline', '');

But no use on it. Can anyone please suggest me the right solution to do it.

Nikola Lukic
  • 4,001
  • 6
  • 44
  • 75
dhana
  • 43
  • 8
  • post more details please if you wanna answer... What you mean when you say "phone" . If works on iOS & android what is the phone – Nikola Lukic May 23 '18 at 07:54
  • @Nikola Lukic Thanks for your suggestion. I have edited my post. – dhana May 23 '18 at 08:28
  • 1
    @NikolaLukic I too have a same problem.Do you have any solution for it – kaviya .P May 23 '18 at 09:18
  • Any error or warning logs ? – Nikola Lukic May 23 '18 at 09:38
  • @Nikala Lukic no errors when i put alert(navigator.mediaDevices) i got "undefined" – dhana May 23 '18 at 10:41
  • Look like duplicate with : https://stackoverflow.com/questions/47207084/navigator-mediadevices-is-null-on-ios-with-chrome-62 , Any way if navigator.mediaDevices is undefined you can't use it . Try to lokace what is it with : var getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia; – Nikola Lukic May 23 '18 at 11:18
  • Try also this : https://stackoverflow.com/questions/21015847/how-to-make-getusermedia-work-on-all-browsers If you have device just test it – Nikola Lukic May 23 '18 at 11:20
  • @Nikola Lukic I've tried whatever in the https://stackoverflow.com/questions/47207084/navigator-mediadevices-is-null-on-ios-with-chrome-62 and https://stackoverflow.com/questions/21015847/how-to-make-getusermedia-work-on-all-browsers and i have a device and tested it thats y i'm saying its working in safari ios and not woring in chrome ios. ios version 11.3 and chrome version 66 and its not working. – dhana May 24 '18 at 11:41
  • my code works perfectly alright in chrome when we use it in android phone and not works in chrome when it comes to ios because ios restricts it.is there any way to overcome this restriction – dhana May 24 '18 at 11:46
  • https://caniuse.com/#search=getUserMedia Supports the older spec's navigator.getUserMedia API, not the newer navigator.mediaDevices.getUserMedia one. This is really relevant web page. – Nikola Lukic May 27 '18 at 21:20
  • @Nikola Lukic The older spec's navigator.getUserMedia API is also not working :-( – dhana May 28 '18 at 11:41
  • I don't know maybe you will need to use https protocol if you don't use remote debugger via USB cable (in that case you can use localhost) for testing! Post also constraints and other code maybe someone will catch this... – Nikola Lukic May 28 '18 at 11:42
  • 1
    @Nikola Lukic have hosted my code in the server and i'm using https only. – dhana May 28 '18 at 11:58
  • @dhana hello did you solve this problem, im also having this problem – Kay Sep 27 '18 at 11:08
  • @Kay i couldn't solve the problem, chrome have restricted permission in ios. if apple provide the permissions then only it's possible. even facebook live stream is not available in ios chrome – dhana Sep 28 '18 at 13:25

0 Answers0