WEBCAM_UNAVAILABLE and cant start in development mode in react

[bishalDores]

hi @xavierjs , i clone the project and according to the readme.md file i used the reactThreeFiberDemos to run in a react project but unfortunately in development mode it didnt run and also after build the project then it run but an error occurs . that is WBCAM_UNAVAILABLE .but my camera is still on. how to resolve this issue ? this happened after running dist folder

this happened after running in development mode

[siam88]

I had the similar problem. i am also stuck in this situation

[xavierjs]

Hi @bishalDores you need to start the project with a HTTPS server, not an HTTP one (I see that you use 8080 port which is http). Mediastream API do not allow camera access for unsecured HTTP, except for localhost.

[xavierjs]

I also noticed that I forgot to push the package-lock.json file. Please remove node_modules directory, run npm install and npm run start again

[siam88]

hi @xavierjs . what's your opinion on running it locally? because it is showing Compiled successfully in the terminal but in the browser, I am getting This site can’t be reached how can I resolve this? Noted that while I am running it locally it is running on https://0.0.0.0:8443/ but is it supposed to run on localhost? if I am not wrong please help

this is the screenshot while i am running it locally or from terminal

this is the result page after running it on the browser

from this repo's readme file, there is shown that it will run on localhost:8080 but while I am running it is showing in the 8443 port. I changed it to 8080 also but it didn't work.

The main problem is it is not running locally

[xavierjs]

Hi @siam88 the localhost:8080 was a mistake in the README. Since in the console it says that the server is listening on port 8443, but in the browser, you cannot reach it, then something blocks it. It should be a firewall issue, or maybe you are using a proxy / VPN