前言 在企业业务发生变化时，采用技术手段整合多个网站从来就不是一件轻松的事情。这里面的障碍主要有：
- 不同的账号和权限管理体系
- 不同的界面风格
- 生硬的链接跳转
- 难以复用的后端接口
从我们的经验看，以上问题要解决，需要使用一种渐进整合的架构，因为整合旧内容和生产新内容是同时进行的，我们做的事情就像是：开着飞机换引擎。
解决思路 本文介绍一种在跨域场景下实现单点登录和网站内容融合的方案，针对性解决前述 4 大障碍，其对应的主要技术点是：
- 通过单点登录统一账号
- 通过 iframe 门户页提供统一的外框导航菜单
- 通过拦截链接跳转和重置地址栏，实现统一的链接跳转行为
- 通过支持 CORS 请求协议，接口可以部署在任何一个关联应用
以下举例说明此方案。
假设我们需要整合的网站分别是 a.my.com（简称 a ）和 b.my.com（简称 b ） 。
实现单点登录 为了实现单点登录，我们需要新增单点登录服务器 sso.my.com 。
改造 a、b 网站底层，让他们的用户账号映射为一个统一的 uniqueId 。并在底层调用单点登录服务器提供的登录认证。
用户首次访问 a 网站感知到的流程如下：
- 用户访问页面 //a.my.com/page.htm
- a.my.com 调用 sso.my.com 认证服务进行鉴权
- 鉴权失败，跳转登录页 //sso.my.com/login.htm?returnUrl=//a.my.com/page.htm
- 登录后回跳进入页面 //a.my.com/page.htm
同理，用户首次访问 b 网站，也会获得一致的体验。
下面是一个淘宝的单点登录的案例，访问"我的淘宝"页面，进入的是登录页。
原页面地址：https://i.taobao.com/my_taobao.htm
带回跳的登录页地址：https://login.taobao.com/member/login.jhtml?redirect_url=https%3A%2F%2Fi.taobao.com%2Fmy_taobao.htm（如图 1 所示）
图 1. 带回跳的淘宝登录页地址 |
