Oracle APEX PWA双屏场景下独立模式新窗口打开方案问询

API 探路者

2026-6-20

解决方案：在已安装的PWA中以独立模式打开新窗口

要实现从已安装的PWA内通过点击按钮打开独立模式新窗口，你需要调整window.open的调用参数，同时确保目标页面属于同一PWA生态。

1. 基础修改方案

直接在window.open的第三个参数中指定display=standalone特性，同时保证目标URL与当前PWA同源：

document.querySelector('#target-button').addEventListener('click', () => {
  const targetUrl = 'f?p=&APP_ID.:5:&SESSION.::::';
  // 可自定义窗口尺寸，适配双屏需求
  window.open(targetUrl, '_blank', 'display=standalone,width=1200,height=800');
});

2. 关键前提条件

目标页面必须和当前PWA同源，且引用了相同的manifest.json，其中display字段需设置为standalone：
```
{
  "display": "standalone",
  "name": "你的PWA应用名称",
  // 其他manifest配置项...
}
```
当前应用必须是已安装并以独立模式运行的PWA，而非在普通浏览器标签页中打开。

3. 双屏适配优化

针对双屏用户，可通过计算屏幕位置自动将新窗口定位到第二屏幕：

document.querySelector('#open-on-second-screen').addEventListener('click', () => {
  const targetUrl = 'f?p=&APP_ID.:5:&SESSION.::::';
  // 假设第二屏位于主屏幕右侧，自动计算位置
  const secondScreenLeft = window.screen.width;
  const secondScreenTop = 0;
  
  window.open(
    targetUrl,
    '_blank',
    `display=standalone,width=${window.screen.width},height=${window.screen.height},left=${secondScreenLeft},top=${secondScreenTop}`
  );
});