尧图网站建设 尧图网络
  • 首页
  • 关于我们
  • 服务项目
  • 案例展示
  • 建站流程
  • 资讯中心
  • 联系我们
首页/资讯中心/详情

记录---window.close()失效 + Chrome浏览器调试线上代码

记录---window.close()失效 + Chrome浏览器调试线上代码
📅 发布时间:2026/6/20 18:31:57

🧑‍💻 写在开头

点赞 + 收藏 === 学会🤣🤣🤣

情况说明

  1. 主系统单点登录点击触发window.open()打开本系统。
  2. 是发布生产后的新需求:要求退出登录后直接关闭当前系统页面。
  3. 本地运行增加了window.close()方法实现功能,点击退出后页面没反应。

排查过程

官方解析中说明,window.close() 方法只能关闭由window.open()或者浏览器直接输入url打开的页面,其余情况安全考虑是被限制的。

1. 验证window.close()失效是否与window.open()触发打开有关

于是保持原本退出登录的window.close()方法不变, 尝试增加打开按钮,点击后调用window.open()打开系统链接。

<template>// ......其他代码<a href="javascript:;" @click="logout">退出</a><a href="javascript:;" @click="logopen">打开</a>
</template><script setup>
function logout() {ElMessageBox.confirm('确定注销并退出系统吗?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).then(() => {userStore.logOut().then((redirect) => {window.close()  // 使用close方法关闭location.href = redirect || ((import.meta.env.VITE_PUBLIC_PATH) + '/index');})
}).catch(() => { });
}function logopen() {window.open('http://localhost/web/index')  // 使用open方法打开
}
</script>

尝试结果:

  1. 打开、退出功能全部正常。
  2. 点击打开按钮,跳转到本地运行的此系统页面。
  3. 点击退出按钮,打开的页面关闭,并且基础的退出清除功能还在。

判断: 主系统的打开方式没有问题,需要把焦点集中在此系统的window.close()失效上。

2. 在退出时,先手动打开一个新窗口,再关闭

在搜索时发现了处理办法,先打开空白窗口触发window.open(),再close,试一下。

function logout() {ElMessageBox.confirm('确定注销并退出系统吗?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).then(() => {userStore.logOut().then((redirect) => {window.open("about:blank","_self")  // 先打开一个空白窗口window.close()  // 使用close方法关闭location.href = redirect || ((import.meta.env.VITE_PUBLIC_PATH) + '/index');})
}).catch(() => { });
}

尝试结果: 无效。

3. 调试线上代码,验证是否跟环境有关

在本地环境下的尝试都不成功的情况下,猜测是否跟环境有关,尝试调试线上代码。

第一步:定位调试文件

根据退出功能中的提示词确定注销并退出系统吗?找到线上代码中退出按钮的所在文件

企业微信截图_20250929194958

第二步:创建存放代码的文件夹并允许修改

企业微信截图_20250929195005

 

企业微信截图_20250929195012

企业微信截图_20250929195020

第三步:修改内容并保存

企业微信截图_20250929195035

 

企业微信截图_20250929195041

 

第四步:刷新验证文件是否修改成功

企业微信截图_20250929195048

第五步:验证退出功能

点击退出,页面关闭。

⚠️Tips:

  1. 必须要打开调试器 --- 之前替换的内容才会生效。
  2. 在调试完成后,务必清除配置,以免对后续产生不必要的影响。

企业微信截图_20250929195054

排查结果

由此可得,window.open()的失效跟环境有关,待部署后的再测试。

 

本文转载于:https://juejin.cn/post/7555042405127487498

如果对您有所帮助,欢迎您点个关注,我会定时更新技术文档,大家一起讨论学习,一起进步。

相关新闻

  • 启发式合并 [USACO22DEC] Making Friends P
  • 加密的病例单
  • 【多线程】什么是原子操作(Atomic Operation)? - 详解

最新新闻

  • 跨平台游戏串流方案选择与配置实战:打造你的专属游戏云
  • Fate/Grand Automata完整实战指南:高效配置F/GO安卓自动化战斗工具
  • Gemini 3.1 Pro国内合规落地:API直连+本地编排实战指南
  • 2026年抗抑菌剂/消毒产品检测机构推荐:广州市微生物研究所集团专业服务 - 品牌推荐官
  • 2025年厨房家居用品实力厂家推荐:青岛乐博智家密封罐/果盘/冷萃壶全系供应 - 品牌推荐官
  • CentOS 8 LAMP环境搭建与三重加固实战指南

日新闻

  • Visual C++运行库修复终极指南:5分钟快速解决Windows软件启动错误
  • 手把手教你构建统计局地区经济数据爬虫:从环境搭建到数据持久化全指南
  • 2026多Agent深度解析:用AI团队替代单一模型,四种架构实战落地

周新闻

  • Visual C++运行库修复终极指南:5分钟快速解决Windows软件启动错误
  • 手把手教你构建统计局地区经济数据爬虫:从环境搭建到数据持久化全指南
  • 2026多Agent深度解析:用AI团队替代单一模型,四种架构实战落地

月新闻

  • 【总结】入门篇:50句话让你记住架构核心概念
  • WeChatMsg技术方案解析:实现Mac微信数据自主管理的完整解决方案
  • WeChatMsg:革新性微信数据备份方案,打造你的专属数字记忆库

关于尧图

  • 公司简介
  • 团队介绍
  • 企业文化
  • 荣誉资质

服务项目

  • 定制开发
  • 电商建站
  • UI 设计
  • 运维服务

快速链接

  • 案例展示
  • 建站流程
  • 常见问题
  • 资讯中心

联系方式

  • 📍北京市朝阳区互联网产业园 A 座 10 层
  • 📞400-888-8888
  • ✉️contact@rkmt.cn
  • 🕐周一至周日 9:00-21:00

© 2024 北京尧图网络科技有限公司 版权所有 | 京 ICP 备 XXXXXXXX 号