2022年12月09日
今天遇到一个问题,是QA提出的一个体验上的问题,这个问题属于遗留问题。前面几期都没有解决,轮到我了,QA居然提出来了。
本来打算从需求上怼回去,但是我也想从技术上解决这个问题。于是就花了几个小时研究了一下。
这个问题是这样的,这是个移动端的项目,由于有的页面比较特殊,进入时,都需要进行一次授权处理,授权完毕后需要更新当前页面所有信息,所以需要重新刷新页面,同时会以search的方式追加参数。
这个授权是通过第三方的sdk来进行的,不能直接改sdk中的代码,而且sdk中有几千行混淆的代码,只能模糊的推理出一部分的逻辑。
QA提出的问题是,在进入这个页面后,点击返回按钮,还在这个页面,需要连续点击两次返回才能完成回到上个页面。
这是因为首次进入时需要授权,授权结束后,会进行重定向,重定向的页面依旧还是当前页面,只不过增加了几个search参数,所以浏览器会把这次重定向记录下来,如此以来,等于有两次当前页面的history记录,于是才要操作两次返回才能返回之前的页面。
解决办法:
- 通过在授权的时候在session中打上一个标记,这个标记的key是当前页面的pathname,值就会是 1。
- 在进入这个页面的时候,通过key来获取session是否存在这个标记,如果存在,就给这个标记的值 设置为2.
- 当用户进行一次返回操作时,判断session中该标记的值是否为2,如果为2,则直接回滚到上一个页面,然后清除掉这个key为pathname的回话。
过程发现:
如果两次跳转的url的pathname一致,并且hash不变,仅仅只是search发生变化,那么并不会触发 popstate、hashchange的事件,所以通过监听这两个事件来进行回滚到上一个页面的操作是无效的。
代码实现:
// ---> tool.js
/**
* Try to trigger the logic of the double jump, and if it is already labeled, go straight back to the previous page.
* 尝试触发两次跳转的逻辑,如果已经打上标签,就直接回到之前的页面。
*/
const triggerDoubleGoBackFlag = () => {
const { count } = Utils.session.handle({ key: location.pathname })
if (count === 2) {
Utils.session.remove({ key: location.pathname })
history.back()
return true
}
if (count === 1) {
Utils.session.handle({ key: location.pathname, value: { count: 2 } })
}
}
/**
* Since the authorization operation will result in two jumps to the url, label this place so that when you rollback, you can directly roll back to the page before the two jumps
* 由于授权操作将导致两次跳转到url,因此要标记此位置,以便在回滚时可以直接回滚到两次跳转之前的页面
*
*/
const markDoubleGoBackFlag = () => {
Utils.session.handle({ key: location.pathname, value: { count: 1 } })
}
export { triggerDoubleGoBackFlag, markDoubleGoBackFlag }
// ---> index.jsx
componentDidMount() {
const isReturn = triggerDoubleGoBackFlag()
if (isReturn) return
}
// ---> service.js
// 授权操作
// ...
// 打上标记
markDoubleGoBackFlag()
// 授权结束,重定向页面之前
// ...
为了方便写片段,我写了一段shell脚本,也就是initFragment.sh
文件。
遇到的这个问题是,shell脚本中的数字变量和字符串变量拼接后会出现很多空格。
这可能是在shell脚本中数字和字符串进行累加的时候会出现二进制字符串,当二进制码再转成字符串时,就多了很多空格。
解决办法:
通过echo 先将数字转成字符串,这样就不会有多余的空格了。
countNumer=`ls -l | grep "^-" | wc -l`
fileDateText=`date +%Y年%m月%d日`
# fileName=$countNumer"."$fileDateText".md"
fileName=`echo $countNumer`"."$fileDateText".md"
上次更新时间: 10年18月2023日 01时57分53秒