0

i have a playcanvas experience made and hosted on a link. which uses gyroscope for vr experience. if i open the link directly in android device. it's working with gyro and all. but when i embedd the link in an iframe and open that page in mobile. the gyroscope is not working. code i used for embedding iframe is :

<iframe id="the_iframe" class="bg" allowvr="yes" allow="vr; xr; accelerometer; magnetometer; gyroscope; autoplay;"
    allowfullscreen mozallowfullscreen="true" webkitallowfullscreen="true" frameborder="0"></iframe>
Sunil Bijlwan
  • 19
  • 6

1 Answers1

0

what worked for me is adding "webxr" to allow list.

<iframe id="the_iframe" class="bg" allowvr="yes" allow="vr; xr; accelerometer; magnetometer; gyroscope; webvr;webxr;"
    allowfullscreen mozallowfullscreen="true" webkitallowfullscreen="true" frameborder="0"></iframe>

although it works for android. not working in ios devices.

Sunil Bijlwan
  • 19
  • 6
  • On iOS you have to requestPermission, see accepted answer here: https://stackoverflow.com/questions/56514116/how-do-i-get-deviceorientationevent-and-devicemotionevent-to-work-on-safari – CatalinBerta Aug 24 '23 at 09:25