V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
CSGO
V2EX  ›  问与答

有关 CSS 网站变黑白是如何做到实时的?

  •  
  •   CSGO · Dec 2, 2022 · 2711 views
    This topic created in 1246 days ago, the information mentioned may be changed or developed.
    我也试着把网页变黑白,结果发现自己刷新是不会变黑白,可能需要把浏览器缓存都删除才可以。
    那例如很多网站的黑白,为啥就可以在我访问的时候被“强制”用上了新的 css ?

    是和用的 cf 的 ttl 缓存时间有关系吗?这个缓存时间表示比如设置 1 天,cf 就会每天都会重新下载一遍我服务器上的文件?
    13 replies    2022-12-02 17:51:44 +08:00
    SGE
        1
    SGE  
       Dec 2, 2022
    Google 一下 大把源码
    ztxcccc
        2
    ztxcccc  
       Dec 2, 2022   ❤️ 2
    css 文件名里有 hash 标识
    html 被更新以后访问的 css 文件从类似于 index.123.css 变成了 index.456.css ,强制你去获取新文件
    Kenmin
        3
    Kenmin  
       Dec 2, 2022
    二楼正解
    CSGO
        4
    CSGO  
    OP
       Dec 2, 2022
    @ztxcccc
    @Kenmin 我应该搜索什么可以获取相关知识?找了 css hash 没看到相关内容。
    Kenmin
        5
    Kenmin  
       Dec 2, 2022   ❤️ 1
    @CSGO 一般是通过 Webpack 打包自动生成的,这里有相关配置文档 https://webpack.js.org/guides/caching/
    chniccs
        6
    chniccs  
       Dec 2, 2022
    @CSGO #4 网页黑白
    christin
        7
    christin  
       Dec 2, 2022 via iPhone
    你是用什么打包工具打的呢? webpack 和 vute 配置的地方不一样
    CSGO
        8
    CSGO  
    OP
       Dec 2, 2022
    懂了,我纯静态。
    Doraismydora
        9
    Doraismydora  
       Dec 2, 2022
    可以在 css 引用后头加上?timestamp=
    这个是很久之前我学前端的时候看到的方法
    daozun
        10
    daozun  
       Dec 2, 2022
    如果使用 nginx 的话,可以加上
    expires 0;
    add_header Cache-Control no-cache;
    强制更新
    ie88
        11
    ie88  
       Dec 2, 2022
    看起来楼主不太懂 web 前端,你查看页面源码,看看 css 文件的后缀就知道了,通常用 webpack 和 vite 打包出来的 js css 文件是带 hash 的
    tool2d
        12
    tool2d  
       Dec 2, 2022   ❤️ 1
    @daozun 强制更新也只能等上一次 css 资源过期后才生效,要不然连客户端查询请求都不会发起。

    一般来说,都是 html 可以设置 no-cache, 而 js/css 都是需要一定缓存的。
    ie88
        13
    ie88  
       Dec 2, 2022
    @ie88 文件名不同,因此浏览器没有缓存,所以服务器返回新的 css js 文件,页面就重新渲染了
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   898 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 45ms · UTC 23:03 · PVG 07:03 · LAX 16:03 · JFK 19:03
    ♥ Do have faith in what you're doing.