Nuxt中如何使用Vue Router实现API返回完整URL的正确重定向？

你遇到的拼接问题是因为router.replace仅支持传入应用内的路径值，直接传入带协议、域名的完整URL时，Vue Router会将其识别为相对路径，自动拼接在当前应用地址之后，不会当做独立的目标地址处理。

方案1：提取URL路径部分后调用Vue Router跳转（推荐，无刷新跳转体验好） #

先通过JS内置的URL对象解析接口返回的完整URL，提取出路径、查询参数、哈希部分后再传给router.replace即可：

// 你的接口返回的完整URL
const targetFullUrl = 'https://mylink.com/another-page.html'
// 解析URL
const url = new URL(targetFullUrl)
// 拼接出内部路径（自动保留查询参数、哈希等内容）
const innerPath = url.pathname + url.search + url.hash
// 调用Vue Router跳转
router.replace(innerPath)

如果你的应用和目标URL是同域的，这个方案可以走Vue Router的客户端路由跳转，不会触发整页刷新，体验最优。

方案2：直接使用location API（会触发整页刷新） #

你现在用的window.location.replace(targetFullUrl)本身是可用的，区别是会整页重载页面，适合目标页面没有走Vue Router注册的场景。

关于params传参的说明 #

params参数仅用于给动态路由传参（比如路由配置为/page/:pageName的场景），你需要跳转固定路径的场景不需要用到params，直接传入解析后的路径字符串即可。

内容的提问来源于stack exchange，提问作者francky