ios 中 localStorage 与微信支付的坑（工作记实）

本文主要是介绍ios 中 localStorage 与微信支付的坑（工作记实），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

系统：IOS

浏览器：Safari

上星期遇到一个IOS支付的问题。需求如下：

在页面A 拉起微信支付；
支付成功后返回页面A 弹出支付确认弹窗；
点击弹窗校验订单支付情况；

根据需求代码实现如下：

在页面A 请求后端接口创建微信支付链接和订单编号并通过 localStorage 保存本次的订单编号（设id:1）；
在页面A 打开微信支付链接成功拉起微信支付功能；
微信支付后返回页面A 点击支付确认弹窗将 localStorage 的 id 发送给后端校验订单支付情况；

正常情况下，确实没有问题。可是当用户首次取消支付，再重新创建订单（设 id:2）。再支付成功后返回页面A ，这时候再点击支付确认弹窗按钮时，读取的 localStorage 的值既然是第一次创建的订单编号 id=1。

当我点击 Safari 浏览器的窗口管理时，发现居然同时存在两个页面A，恰好微信支付成功后返回的页面居然是第一次的窗口，所以不管后面重新创建多少次订单，localStorage 的数据 id 始终是第一次创建时保存的。切换到浏览器的另一个页面A 窗口，发现值又是最新的。这就难受了，好好的居然出这茬，怎么办？

最开始我是使用的 sessionStorage 经过网上一顿操作后，得知要使用 localStorage。后来 localStorage 都有问题后，我才去排查是不是订单编号出了问题。最后找到了原因，解决办法其实很简单，使用 cookie 就可以啦。此时此刻，除了想太阳库克，也没有别的想法了。

也许除了文中的情况之外，其它的有可能创建新窗口的情况下也有同样的问题，大家在使用 sessionStorage 和 localStorage 时应当考虑该问题。

本篇文章希望能帮助到与我一样“捉鸡”的大前端。没啥想说的，一起太阳他！