From a0ae73af9aae2f3db1f2de4677f7fbe8722241a5 Mon Sep 17 00:00:00 2001 From: zxr <271055687@qq.com> Date: Fri, 7 Aug 2026 17:35:29 +0800 Subject: [PATCH] =?UTF-8?q?docs:=20=E6=B8=85=E7=90=86=E6=97=A7=E6=96=87?= =?UTF-8?q?=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- IFRAME_MODE.md | 178 ------------------------------------------------- 1 file changed, 178 deletions(-) delete mode 100644 IFRAME_MODE.md diff --git a/IFRAME_MODE.md b/IFRAME_MODE.md deleted file mode 100644 index ae33c31..0000000 --- a/IFRAME_MODE.md +++ /dev/null @@ -1,178 +0,0 @@ -# GoView iframe 嵌入模式使用说明 - -## 概述 - -GoView 已支持通过 iframe 嵌入到其他系统中运行,无需独立的登录流程。系统会自动从 URL 参数中读取 token 进行身份验证。 - -**默认跳转**:系统启动后会直接跳转到项目列表页面 (`/project/items`),跳过登录步骤。 - -## 使用方法 - -### 1. 基本用法 - -在 iframe 的 src 中添加 `token` 参数: - -```html - - - - - -``` - -### 2. URL 参数说明 - -- `token` (必需): 用户身份认证令牌 - -**示例:** -``` -# 默认路径,自动跳转到项目列表 -http://localhost:3000/#/?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9... - -# 或明确指定项目列表路径 -http://localhost:3000/#/project/items?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9... -``` - -### 3. 支持的页面路由 - -您可以直接跳转到任何页面,只需在 URL 中添加 token 参数: - -- **项目列表**(默认): `/#/?token=YOUR_TOKEN` 或 `/#/project/items?token=YOUR_TOKEN` -- 项目首页: `/#/project?token=YOUR_TOKEN` -- 图表编辑: `/#/chart/home/PROJECT_ID?token=YOUR_TOKEN` -- 图表预览: `/#/chart/preview/PROJECT_ID?token=YOUR_TOKEN` - -## 技术实现 - -### 修改内容 - -1. **路由守卫** (`src/router/router-guards.ts`) - - 自动从 URL 提取 token 并保存到本地存储 - - **完全移除登录验证**:不再检查登录状态 - - **允许所有路由直接访问**:无需登录即可访问任何页面 - -2. **路由配置** (`src/router/index.ts`) - - 默认路由修改为 `/project/items`(项目列表) - - 跳过登录页面 - -3. **Axios 拦截器** (`src/api/axios.ts`) - - 请求拦截器:移除重定向到登录页的逻辑 - - 响应拦截器:token 过期时不再跳转登录页 - - 所有请求自动携带 token - -4. **应用初始化** (`src/main.ts`) - - 应用启动时自动读取 URL 中的 token - - 初始化用户信息到 store - -### Token 存储 - -Token 会被自动存储到以下位置: -- **localStorage**: 持久化存储,刷新页面后仍然有效 -- **Pinia Store**: 应用运行时状态管理 - -## 注意事项 - -### 1. Token 刷新 - -如果 token 发生变化,需要更新 iframe 的 src: - -```javascript -// 更新 token -const newToken = 'NEW_TOKEN_HERE' -iframe.src = `http://your-goview-domain/#/?token=${newToken}` -``` - -### 2. Token 过期处理 - -当 token 过期时: -- 系统会在控制台输出警告信息 -- 用户会看到"登录过期"的提示 -- 不会自动跳转到登录页 -- 需要父系统更新 iframe 的 token 参数 - -### 3. 安全建议 - -- 确保 token 通过 HTTPS 传输 -- token 应该设置合理的过期时间 -- 考虑使用短期 token + 刷新 token 机制 - -### 4. 跨域问题 - -如果 GoView 和父系统不在同一域名下,需要: -- 配置 CORS 允许跨域请求 -- 确保 API 服务器允许来自父系统域名的请求 - -## 控制台日志 - -系统会输出以下日志帮助调试: - -- ✅ `[GoView] iframe 模式:已从 URL 参数中获取 token 并初始化` -- ⚠️ `[GoView] iframe 模式:未在 URL 中检测到 token 参数` -- ⚠️ `[GoView] iframe 模式:未找到身份信息,请确保 URL 中包含 token 参数` -- ❌ `[GoView] iframe 模式:token 已过期,请更新 URL 中的 token 参数` - -## 示例代码 - -### 父系统嵌入示例 - -```html - - - - GoView 嵌入示例 - - -
- -
- - - - -``` - -## 兼容性说明 - -- ✅ 保留了原有的登录功能(如果不通过 URL 传递 token,仍可使用登录页面) -- ✅ iframe 模式和独立部署模式可以共存 -- ✅ 所有原有功能均不受影响 - -## 回退到登录模式 - -如果需要回退到原有的登录模式,只需: -1. 访问不带 token 参数的 URL -2. 系统会提示警告但允许继续访问 -3. 或者恢复之前的代码版本 - -## 技术支持 - -如有问题,请查看: -1. 浏览器控制台日志 -2. 网络请求中的 token 是否正确携带 -3. API 响应是否返回 token 过期错误