iOS Safari 17.6.1如何刷新预加载的JSON资源？

安全阿岳

2026-6-19

解决iOS Safari预加载资源缓存问题的方案

优化预加载请求的缓存控制

Safari对预加载资源的缓存处理逻辑和普通请求存在差异，可从以下两点调整：

在Link头中直接追加缓存控制指令（部分浏览器支持该扩展用法）：

Link: </api/GetUserData>; rel="preload"; as="fetch"; cache-control="no-store, no-cache"

确保/api/GetUserData接口返回的响应头中优先保留Cache-Control: no-store，Safari对no-store的优先级判定高于其他缓存指令，之前的多指令组合可能被浏览器忽略部分字段。

主动强制获取最新数据

在后续需要刷新用户数据的fetch请求中，显式指定缓存模式，跳过本地缓存：

使用cache: 'reload'强制从服务器拉取最新数据：

fetch('/api/GetUserData', { cache: 'reload' })
  .then(res => res.json())
  .then(data => { /* 更新页面用户数据 */ });

或者用cache: 'no-store'确保请求全程不被缓存：

fetch('/api/GetUserData', { cache: 'no-store' })
  .then(res => res.json())
  .then(data => { /* 更新页面用户数据 */ });

调整预加载策略

如果Link头预加载的缓存问题无法彻底解决，可改用JS主动预请求的方式，更灵活控制缓存行为：

// 页面加载时发起预请求，用no-store避免缓存
window.addEventListener('load', () => {
  fetch('/api/GetUserData', { cache: 'no-store' })
    .then(res => res.json())
    .then(data => { /* 将数据暂存到内存，后续直接读取 */ });
});

当用户数据变更时，再次发起带cache: 'reload'的请求覆盖内存中的数据即可。