url地址参数进行编码和解码

lryh_

已于 2024-07-05 15:22:41 修改

阅读量278

点赞数 3

文章标签：前端 javascript 开发语言

于 2024-06-12 16:35:11 首次发布

本文链接：https://blog.csdn.net/lryh_/article/details/139630493

版权

希望在 URL 中传递的参数值在编码后不可见，但在使用时能够解码为原始值，可以使用一种加密的方法（例如 Base64 编码）

在前端发送参数时进行 Base64 编码： btoa

// 确保 access_token 存在
const accessToken = 'url 地址'

if (accessToken) {
  // 对参数进行 Base64 编码
  const encodedUsername = btoa(username)  // Base64 编码
  const encodedUserRole = btoa(userRole)  // Base64 编码
  const encodedUserlabel = encodeURIComponent(userlabel)  // URL 编码

  // 构造包含查询参数的 URL
  const url = `${accessToken}?username=${encodedUsername}&userrole=${encodedUserRole}&userlabel=${encodedUserlabel}`

  // 在新窗口中打开构造的 URL
  window.open(url)
} else {
  console.error('Access token is missing')
}

接收方再进行 Base64 解码：atob

// 从 URL 中获取参数值
const urlParams = new URLSearchParams(window.location.search)
const encodedUsername = urlParams.get('username')
const encodedUserRole = urlParams.get('userrole')
const encodedUserlabel = urlParams.get('userlabel')

// 对参数进行 Base64 解码
const username = atob(encodedUsername)  // Base64 解码
const userRole = atob(encodedUserRole)  // URL 解码
const userlabel = decodeURIComponent(encodedUserlabel)  // URL 解码

console.log(`Username: ${username}, UserRole: ${userRole}, UserLabel: ${userlabel}`)