Javascript 如何在浏览器中的webapp中强制横向定位

我有一个在Android上的chrome浏览器中运行的web应用程序。
我想将方向锁定为横向

根据教程，我尝试了几个选项：
使用ScreenOrientation.lock（），这是实验性的。 示例代码在我的手机（Pixel3，Android 11）中不起作用-当设备旋转时，方向会改变

我还尝试了CSS技巧，如果检测到设备处于纵向模式，它会将屏幕旋转90度。
屏幕以横向模式呈现，但实际应用程序的功能被破坏。例如，当在x方向上移动手指时，将被解释为在y方向上移动

在Android Chrome中的Pixel3手机上尝试也失败（旋转设备时方向会改变）

我可以通过将页面安装为PWA“添加到主屏幕”并使用清单来锁定方向

cat manifest.json
  "display": "standalone",
  "orientation": "landscape",

但这要求用户将应用程序安装为

我想在常规浏览器中运行webapp时锁定其方向。
这可能吗

---

谢谢

你能做的最好的选择就是生成一个简单的

弹出窗口

，不允许输入，即；盖住屏幕。然后使用以下代码[可以更好地微调]来检测用户是处于纵向模式还是横向模式

setTimeout（（）=>{
如果（window.innerHeight>window.innerWidth）{
document.body.getElementById（'custom-popup'）.classList.add（'show'）；
//显然，当添加类“CustomPopup”时，您必须创建一个可见的弹出窗口。
}否则{
document.body.getElementById（'custom-popup'）.classList.remove（'show'）；
//用户切换到了横向
}
}, 3000);

您可以做的最佳选择是生成一个简单的

弹出窗口

，该弹出窗口不允许输入，即；盖住屏幕。然后使用以下代码[可以更好地微调]来检测用户是处于纵向模式还是横向模式

setTimeout（（）=>{
如果（window.innerHeight>window.innerWidth）{
document.body.getElementById（'custom-popup'）.classList.add（'show'）；
//显然，当添加类“CustomPopup”时，您必须创建一个可见的弹出窗口。
}否则{
document.body.getElementById（'custom-popup'）.classList.remove（'show'）；
//用户切换到了横向
}
}, 3000);