ToB企服应用市场:ToB评测及商务社交产业平台

标题: 前端实现跳转外链的几种方式 [打印本页]
作者: 飞不高    时间: 2025-2-14 21:16
标题: 前端实现跳转外链的几种方式
前端实现跳转外链并携带参数的几种方式（例如：携带token）：
一、第一种方式构建目标外部链接，并将token作为URL参数附加上去
  1. //encodeURIComponent以防止潜在的XSS攻击或URL解析
  2. //http://127.0.0.1:5173替换为要打开的外链地址
  3. const externalLink = 'http://127.0.0.1:5173/?token=' + encodeURIComponent(token);
  4. // 使用window.location.href跳转到外部链接，当前页面打开
  5. window.location.href = externalLink
复制代码
通过window.location.search可以获取携带的参数。
二、第二种方式newUrl.searchParams
  1. const newUrl = new URL('http://127.0.0.1:5173');
  2. newUrl.searchParams.set('token', encodeURIComponent(token)); // 将token作为查询参数添加到URL
  3. window.open(newUrl.href, '_blank'); // 在新页面打开链接
复制代码
通过new URLSearchParams(window.location.search)获取携带的参数；
第一种和第二种传参的方式会在地点栏暴露token,可以利用第三种方式，window.name来隐式传递了,接收页通过window.name获取token
  1. const newUrl = new URL('http://127.0.0.1:5173');
  2. window.open(newUrl, token);
复制代码


免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。



欢迎光临 ToB企服应用市场:ToB评测及商务社交产业平台 (https://dis.qidao123.com/) Powered by Discuz! X3.4