解决ie对ajax请求的结果进行缓存的问题

最新推荐文章于 2022-01-12 15:40:54 发布

小小小竹子

最新推荐文章于 2022-01-12 15:40:54 发布

阅读量265

点赞数

分类专栏： AJAX 初学者的成长日记文章标签： ajax

本文链接：https://blog.csdn.net/qq_42524153/article/details/109493366

版权

初学者的成长日记同时被 2 个专栏收录

24 篇文章 0 订阅

订阅专栏

AJAX

11 篇文章 0 订阅

订阅专栏

问题描述:

IE浏览器会对ajax请求的结果进行缓存导致下次再发送同样请求的时候得到的数据是IE本地缓存的数据而不是最新数据

解决办法:

在请求地址(URL)后面跟上时间戳 : Date.now(), 这样每次请求的url都不一样让每一次发送的请求都是新的请求使得它不走本地缓存而直接去服务器拿数据,保证每次拿到的都是最新数据

如何加时间戳: 在路径后面拼接上 ?t=’+Date.now() ,如下图所示:

xhr.open('get','http://127.0.0.1:8000/ie?t='+Date.now());

完整案例展示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #result{
            width: 200px;
            height: 100px;
            border: 1px solid #90b;
        }
    </style>
</head>
<body>
    <!-- ie浏览器会对ajax请求的结果进行缓存 导致下次次再发送请求的时候得到的数据是本地缓存的数据 而不是最新数据-->
    <button id="btn">点击发送请求</button>
    <div id="result"></div>
    <script>
        const result = document.getElementById("result");
        const btn = document.getElementById("btn")
        btn.addEventListener('click',function(){
            const xhr = new XMLHttpRequest();
            //Date.now() 时间戳
            //请求地址后面拼接上时间戳 这样每次请求的url都不一样 让每一次发送的请求都是新的请求 使得不走本地缓存
            xhr.open('get','http://127.0.0.1:8000/ie?t='+Date.now());
            xhr.send();
            xhr.onreadystatechange = function(){
                if(xhr.readyState === 4){
                    if(xhr.status >= 200 && xhr.status < 300){
                        result.innerHTML = xhr.response;
                    }
                }
            }
        })
    </script>
</body>
</html>

服务器脚本:

//1 引入express
const express = require('express');

//2 创建应用对象
const app = express();

app.get('/ie',(request,response)=>{
    //设置响应头 设置允许跨域
    response.setHeader('Access-Control-Allow-Origin','*');
    //设置响应体
    response.send('hello ie');
});

//4 监听端口
app.listen(8000,()=>{
    console.log('服务器已启动...');
})

小小小竹子

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
解决ie对ajax请求的结果进行缓存的问题

问题描述:    IE浏览器会对ajax请求的结果进行缓存导致下次再发送同样请求的时候得到的数据是IE本地缓存的数据而不是最新数据解决办法:    在请求地址(URL)后面跟上时间戳 :  Date.now(),  这样每次请求的url都不一样让每一次发送的请求都是新的请求使得它不走本地缓存而直接去服务器拿数据,保证每次拿到的都是最新数据如何加时间戳: 在路径后面
复制链接

扫一扫

专栏目录