页面携带参数跳转分为2大类：当前页面刷新跳转；新开webview。

【当前页面刷新跳转】

// 方式一：search，query 参数明文展示在URL，只能携带简单的字符串&&数字，刷新不丢失
   * A页面：
   * hashHistory.push({
        pathname: URL,
        search: `?ruleId=${ruleId}&type=${type}`,
       
        //或者
        query: {id, readOnly: true,},

        //或者
        state: {
          equipment: equipmentType,
          business: businessType,
          work: workType,
          parentId: baseRequirementId,
        },
      })
     B页面接收：
       const { type, ruleId } = props.location.query

      
    // 方式二：state 参数不在URL，能携带对象
       hashHistory.push({
        pathname: URL,
        state: {
          equipment: equipmentType,
          business: businessType,
          work: workType,
          parentId: baseRequirementId,
        },
      })

        B页面接收：
        const { equipment, business, work, parentId } = props.location?.state || {}


     // 方式三：Link 与 push一样，但是加target='_blank'可以新开页面
       <Link to={{ 
             pathname:"/jump", 
             hash:'#ahash',  
             query:{foo: 'foo', boo:'boo'},  
             state:{data:'hello'}   

             或者
             to={`/system/operation/equipment/spotCheckEdit?configId=${checkConfigId}`}
         }}>
       点击跳转
      </Link>
   */

【新开webview】

  // 方式一：Link 加target='_blank'可以新开页面
  
  // 方式二：window.open

     A页面跳转：

     const { origin, pathname } = window.location
       window.open(
         `${origin}${pathname}#${KNIGHT_DETAIL_URL}?from=squadBoard&key=${key}`,
         '_blank')

      B页面接收：
      const { from } = location.query 


  // 方式三：加密+window.open
  
     A页面跳转：
     const openPage = (exceptionType) => {
      let params = {
         ...optionsParam,
         exceptionType,
      }
      加密
      let key = encrypt(params)
      const { origin, pathname } = window.location
      window.open(
         `${origin}${pathname}#${KNIGHT_DETAIL_URL}?from=squadBoard&key=${key}`,
          '_blank'
       )
      }

      B页面接收：
      const { To, key } = location.query
      // 解密
      let values = decrypt(key) || {}


     // 方式四：加密

加密代码

初始版本：会报错malformed utf-8 data

  var data = [{id: 1}, {id: 2}]

  // Encrypt
  var ciphertext = CryptoJS.AES.encrypt(JSON.stringify(data), 'secret key 123');

  // Decrypt
  var bytes = CryptoJS.AES.decrypt(ciphertext.toString(), 'secret key 123');

问题：1、没有进行base64 2、原因：接口返回结果浏览器会自动换行导致数据中存在换行，base64无法正常转码，过滤掉空格就可以了，有的网站可以正常解码出来是因为他们内置了去掉空格。

import CryptoJS from "crypto-js"; const KEY = 'aes' // 加密 export const encrypt = (params) => { let encJson = CryptoJS.AES.encrypt(JSON.stringify(params), KEY).toString() let encData = CryptoJS.enc.Base64.stringify(CryptoJS.enc.Utf8.parse(encJson)) return encData }

// 解密 export const decrypt = (val) => { // 去空格 let params = val.replace(/\s/g, '') let decData = CryptoJS.enc.Base64.parse(params).toString(CryptoJS.enc.Utf8) //解密数据 let decJson = CryptoJS.AES.decrypt(decData, KEY).toString(CryptoJS.enc.Utf8) let userInfo = JSON.parse(decJson) return userInfo }


https://blog.csdn.net/qq_41262798/article/details/126460341?spm=1001.2101.3001.6650.2&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-2-126460341-blog-88705134.235%5Ev38%5Epc_relevant_anti_vip&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-2-126460341-blog-88705134.235%5Ev38%5Epc_relevant_anti_vip&utm_relevant_index=3


https://blog.csdn.net/weixin_34185560/article/details/88705134?spm=1001.2101.3001.6650.1&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-1-88705134-blog-89742520.235%5Ev38%5Epc_relevant_anti_vip&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-1-88705134-blog-89742520.235%5Ev38%5Epc_relevant_anti_vip&utm_relevant_index=2

页面携带参数跳转、crypto-js加密

【当前页面刷新跳转】

【新开webview】

加密代码