AR-js-org / AR.js

Image tracking, Location Based AR, Marker tracking. All on the Web.
MIT License
5.38k stars 919 forks source link

webcamera error;name:notReadableError #147

Open USuperMe opened 4 years ago

USuperMe commented 4 years ago

hello ;my mobile has Multiple cameras;

Run 'httsp://www.xxx.com/AR.js/aframe/example/images-tracking/nft/index.html ' it's ok on the PC. But run my mobile, alert : "Webcam Error ; Name :NotReadableError ;Message:Could not start video source" .

I use these scripts:

<script src="../../image-tracking/js/aframe-master.min.js"></script> <script src="../../image-tracking/js/aframe-ar-nft.js"></script>" ;

so ,I think this problem is caused by 'aframe-ar-nft.js '. because my mobile is multiple cameras devices. this ‘aframe-ar-nft.js ’ could not distinguish correct devices id 。 can you help me ?

Thank you !!! Good Luck.

My Devices :huawei mate 30 pro.

JamesBotterill commented 4 years ago

What's the browser on your device, do you get an alert dialogue to allow browser to access camera?

I mainly develop on a muti-camera phone without issue

USuperMe commented 4 years ago

What's the browser on your device, do you get an alert dialogue to allow browser to access camera?

I mainly develop on a muti-camera phone without issue

I use multiple browsers chrome/firefox/edge on my mobile . all failed .

it is shown below :

---Webcam Error ---Name:NotReadableError ---Message:Could not start video source

the Permission is passed and i already allow browser access camera ,i sure .

I use other mobile devices test also is successed . but use my mobile is failed ;

my devices is :

  1. huawei mate 30pro ,has multiply cameras devices .(from devices id log)
  2. Android 10

on my pc test is successed (chrome/firefox/edge).

I guess this problem is "aframe-ar-nft.js" get my devices id error .

Thank you reply !!!

navanchauhan commented 4 years ago

@USuperMe Can you test this website and if it can access your phone's both cameras: https://simpl.info/getusermedia/sources/

I use other mobile devices test also is successed . but use my mobile is failed ;

If I am understanding you correctly, the demo is working on other devices but it is failing on your device?

USuperMe commented 4 years ago

@USuperMe Can you test this website and if it can access your phone's both cameras: https://simpl.info/getusermedia/sources/

I use other mobile devices test also is successed . but use my mobile is failed ;

If I am understanding you correctly, the demo is working on other devices but it is failing on your device?

USuperMe commented 4 years ago

@USuperMe Can you test this website and if it can access your phone's both cameras: https://simpl.info/getusermedia/sources/

I use other mobile devices test also is successed . but use my mobile is failed ;

If I am understanding you correctly, the demo is working on other devices but it is failing on your device?

@USuperMe Can you test this website and if it can access your phone's both cameras: https://simpl.info/getusermedia/sources/

I use other mobile devices test also is successed . but use my mobile is failed ;

If I am understanding you correctly, the demo is working on other devices but it is failing on your device?

Thank you . @navanchauhan

My device can open this website and camera :https://simpl.info/getusermedia/sources/

but the demo(AR.js-master/aframe/examples/image-tracking/nft/index.html) is working on other devices but it is failing on my device (camera open failed ).

By modeifying this code ,I've solved the problem . the following:

AR.js-master/three.js/src/threex/threex-artoolkitsource.js/ handle webcam source

userMediaConstraints.video.deviceId = ***

then . in the linux os Make Build .

Reference https://developer.cdn.mozilla.net/zh-CN/docs/Web/API/MediaDevices

rchowe commented 4 years ago

We had the same problem with a Samsung Galaxy S10; we kept getting a NotReadableError, but most other getUserMedia() test websites worked fine.

We tested a lot of MediaDevices.getUserMedia() demos and found that Chrome on the S10 had issues handling ideal values for video -- if the ideal values for length and width were too low (as in ar.js where it is set to 640x480 by default), we would get NotReadableError instead of the API automatically choosing a larger resolution.

The other confusing thing is that, although we were using A-Frame, we had to modify three.js/src/threex/threex-artoolkitsource.js to influence the camera access. We changed sourceWidth, sourceHeight, displayWidth, and displayHeight to 1024 and we stopped getting NotReadableError and the camera started working on the S10.

I don't know if the change has other consequences, so I haven't submitted a PR, but in our testing it has made the S10 work and it has not seemed to break the functionality on other phones.

nicolocarpignoli commented 3 years ago

@rchowe thanks, you can actually submit a PR (that would be great) and provide a live example that users can test in order to see if this config breaks or not compatibility with other devices.