如何判断一个页面是 window.open 打开的，还是直接打开

0背景

我们做需求，有时候会遇见特殊的需求。比如我们一个系统 A 点击某些操作可以跳转到另一个系统 B，此时 B 系统需要知晓：如果是其他系统跳转过来的，我们展示有功能（OPERATION1）；单独打开的系统没有（OPERATION1）功能，可以看成按钮等一类的特殊操作。

1实现

我们可以借助 window.opener 来判断是否是跳转过来的，按 vue3 举例：

const fromOpen = ref(window.opener && window.opener !== window);

2注意事项

刷新与复制 URL

即使通过 window.open 打开的页面被刷新（如 F5），window.opener 属性仍然会存在。但是，如果将该页面的 URL 复制后在新的浏览器标签页或窗口中打开，则新页面的 window.opener 将是 null 或 undefined，因为它不是通过 window.open 打开的。

浏览器差异

尽管大多数现代浏览器都遵循相似的行为，但始终建议在不同浏览器中测试以确保兼容性。

安全策略

需要注意的是，浏览器的弹窗拦截功能可能会阻止 window.open 的调用，从而影响到 window.opener 的预期行为。确保在允许弹窗的上下文中测试相关功能。

其他打开方式

除了 window.open，还有其他方式可以打开新窗口或标签页（如通过用户点击带有 target="_blank" 属性的链接），但这些方式不会设置 window.opener 属性。

通过上述步骤和注意事项，可以较为准确地判断一个页面是通过 window.open 打开的还是直接在当前页面打开的。