Übersicht(macOS)组件图片缓存问题：如何阻止图片缓存

你的问题核心是Übersicht基于的WebKit内核缓存了同名图片，导致图片被覆盖后无法加载新内容，而你原有的update函数因jQuery对象操作错误未生效。以下是几个可行的解决方法：

方法1：修复update函数的DOM操作错误 #

你原代码中用$(domEl).find('.leImage')得到的是jQuery对象，直接访问.src属性无效，需用jQuery的.attr()方法修改，或者获取原生DOM元素后操作。修改后的update函数如下：

update: (output, domEl) ->
  $img = $(domEl).find('.leImage')
  # 移除旧缓存参数，添加新随机数
  baseSrc = $img.attr('src').split('?')[0]
  $img.attr('src', "#{baseSrc}?v=#{Math.random()}")

每次刷新时会给图片URL添加新的随机查询参数，强制浏览器重新请求图片，绕过缓存。

方法2：移除update函数，直接在render中生成带随机参数的URL #

Übersicht触发refreshFrequency时，若未定义update函数，会重新执行render生成新DOM。你可以删掉update，直接在render里给src加随机参数：

command: "osascript 'RandomPhoto.widget/export_random_photo.scpt'"
refreshFrequency: '30m'
style: """
.leImage
  [styles here - irrelevant for this problem]
"""
render: (output) ->
  """
    <img class="leImage" src="RandomPhoto.widget/rnd.jpeg?v=#{Math.random()}" />
  """

每次刷新都会生成带新随机数的img标签，从根源上避免缓存问题。

方法3：修改图片文件的修改时间（无需修改组件代码） #

浏览器缓存会参考文件的最后修改时间，你可以在AppleScript导出图片后，用touch命令更新文件修改时间，让浏览器认为文件已更新：
在export_random_photo.scpt末尾添加：

do shell script "touch 'RandomPhoto.widget/rnd.jpeg'"

无需修改组件的CoffeeScript代码，仅通过调整AppleScript就能让浏览器重新加载图片。

内容的提问来源于stack exchange，提问作者max1mvs