navigator.mediaDevices.getUserMedia, No camera feedback when using mobile browsers but works perfectly in Desktop browsers

When accessing thru desktop browser its working locally and using https:// connection
but when im using mobile (android and IOS) browser (safari for IOS)(chrome and brave) for testing no feedback from my function, not even hitting my message logger and its not also hitting the try catch if theres some error using mobile browser.

Note : Permission on app settings and site setting for browsers are enabled for camera.
I also have secured connection because it was deployed on the server.

here is my code but its not working on mobile browsers, hoping anyone can help me

THankssss.

html

   <video id="video" muted autoplay playsinline width="557" height="418"></video>

js

const video = document.getElementById('video');

   try {
       const stream = await navigator.mediaDevices.getUserMedia({ audio: false, video: true });
       video.srcObject = stream;
       document.getElementById('lblcam').innerHTML = 'it works!!!';

   } catch (err) {
       document.getElementById('lblcam').innerHTML = 'errrr: ' + error.message + '! ';
   }

I also tried this

const videotag = document.getElementById('video');

  try {

      navigator.mediaDevices.getUserMedia({ video: { facingMode: 'environment' } })
          .then(stream => {


              videotag.srcObject = stream;
              videotag.onloadedmetadata = () => {
                  videotag.play();
              };

              document.querySelectorAll('.btn-cam').forEach(elem => {
                  elem.disabled = false;
              });


          }).catch(err => {

              document.getElementById('lblcam').innerHTML = 'Unable to access the camera: ' + err.message + '!';
              document.querySelectorAll('.btn-cam').forEach(elem => {
                  elem.disabled = true;
              });

          });


  } catch (error) {

      document.getElementById('lblcam').innerHTML = 'Error accessing the camera: ' + error.message + '! ';
      document.querySelectorAll('.btn-cam').forEach(elem => {
          elem.disabled = true;
      });

  }

Tried parameters that suggested from docs and yet no camera feedback from mobile browsers