最近在作一个H5商城项目，用到了支付宝跟微信的支付，可是遇到了如下的问题： 当前页面为提交订单页，包含了用户帐号密码、买家留言、优惠券选择、支付方式选择等等，内容填好后点击提交订单跳转到对应支付方式的支付页面，可是问题来了，假如用支付宝，在刚跳转到支付宝页面时不选择下一步，而是直接取消支付，用浏览器回退按钮返回到提交订单页，这时还能够点击提交订单来再次支付，但实际算是重复生成订单的bug了；并且对不一样的手机，不一样的浏览器在取消支付回退到提交订单页时，有的页面已经被刷新，还得用户从新输入内容才能提交。html
为了解决提早取消支付形成的bug，就想到了取消支付后直接跳转到个人订单列表页面，在订单页能够查看刚下的订单详情，能够选择完成支付。浏览器
可是提早取消支付不会触发支付宝和微信设置的支付完成或者取消支付对应的跳转页面。经过百度一通搜索，发现了history.pushState彻底能够解决此问题。安全
history.pushState()主要是在不刷新浏览器的状况下，建立新的浏览记录并插入浏览记录队列中。微信
1.状态对象（stateObject）--stateObject是一个JavaScript对象，经过pushState方法能够将stateObject内容传递到新页面中。jsp
2.标题（title）--几乎没有浏览器支持该参数，可是传一个空字符串会比较安全。url
3.地址（url）--新的历史记录条目的地址（可选，不指定的话则为文档当前URL）；浏览器在调用pushState()方法后不会加载该地址；传入的URL与当前URL应该是同源的，不然，pushState()会抛出异常。spa
好比当前提交订单页面地址为 confirmOrder.jsp，使用code
history.pushState({}, "MyOrder", "myOrder.jsp")
复制代码
为当前浏览器添加一条myOrder.jsp的历史记录，提交订单后跳转到其余支付页面pay.jsp，这时按浏览器回退就会返回到myOrder.jsp页面。htm
详情能够参考：对象