页面刷新重新提交上一次请求解决方法

本文探讨了一个使用Struts框架和JSP的旧项目中,页面刷新重复执行文件导出请求的问题。作者分析了浏览器在刷新时重发上一次请求的原因,并提出了解决方案:利用`window.history.replaceState`方法替换当前页面的历史记录,防止刷新时重复提交。通过在页面加载时执行此方法,可以避免文件导出功能被意外触发。同时,文章提醒读者在某些情况下可能需要根据实际URL调整代码。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

前言:公司里面有一个项目,前端是用JSP编写的,并且还是使用的Struts框架。用的技术可以说是非常老了。

话不多说,先简单介绍一下我遇到的问题所在。页面上有一个文件导出的按钮,当执行文件导出功能后,页面上会出现一个弹窗,显示文件导出成功或者导出失败等提示信息。功能使没有问题的,但是执行导出后你鼠标右键点击刷新页面,会又执行一次文件导出。这就出现问题了,页面刷新会重复提交上一次请求。

网上搜索了一下,大多数人所提供的方法都是使用重定向了,ajax了,令牌了之类等等,但就只是简单的介绍,他们说的方法确实是没有问题的,但有时候需要结合项目本身,找出一个适合的方法。

首先来说一下,为什么页面提交会执行上一次请求。浏览器向服务端发送请求的时候,会默认将上一次请求存储在浏览器中,刷新页面,浏览器会和服务器发生一次交互,这个时候就会将上一次请求重新执行一遍。

很多人不明白,为什么刷新页面,就要重新把上一次请求再执行一遍。不执行行不行。你想啊,刷新页面,意味着浏览器和服务器要发生一次交互。但是如果浏览器什么都不做,那怎么和服务器交互呢。连显示页面都不可能。

解决方法:
在页面刚一加载的时候,将浏览器中存储的上一次请求给替换掉。

$(function () {
    if(window.history.replaceState)
    {
         window.history.replaceState(null, null, window.location.href)
    }

})

window.history.replaceState这个方法的作用就是把当前的页面的历史记录替换掉, 但不会刷新网页本来历史记录是之前的POST请求提交的操作, 替换后变为当前的页面网址。我们只需要在页面载入的时候执行这一句即可。

有时候这种方式可能也会出现一点小问题,我们可以打开F12,刷新页面,看看浏览器发送的请求是不是我们想要发送的地址。如果不是,那么我们可以将window.location.href修改为具体的url地址。

$(function () {
    if(window.history.replaceState)
    {
        window.history.replaceState(null, null, '具体要替换的地址')
    }

})

加上上述操作之后,再执行生成文件功能,点击刷新后,页面不会重复提交。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值