如何在R包打包的Shiny应用的JS文件中正确引用图片资源？

嘿，我之前也碰到过这个坑！Shiny对R包里静态资源的路径处理和本地开发时不太一样，咱一步步来解决：

首先得搞明白核心逻辑：当你的R包安装完成后，inst/www里的所有文件都会被放到包安装目录的www文件夹里，但Shiny不会直接把这个目录和应用的根路径挂钩，所以你之前试的那些相对路径都不管用。

第一步：给你的包资源注册专属访问路径 #

在你的包里加个初始化脚本（比如zzz.R，这个文件一般用来放包加载时要执行的代码），写上这段代码：

.onLoad <- function(libname, pkgname) {
  shiny::addResourcePath(
    prefix = "my_package_resources",  # 这个前缀可以自定义，比如直接用你的包名也行
    directoryPath = system.file("www", package = pkgname)
  )
}

这段代码的作用是，当用户加载你的包时，Shiny会把你包的inst/www目录映射成一个叫my_package_resources的URL路径，这样不管包装在系统哪个位置，都能通过这个固定路径找到资源。

第二步：修改JS里的图片路径 #

现在把你JS代码里的图片路径改成这样：

function showRecordingIcon() { 
  var img = document.createElement("img"); 
  img.style.display = "block"; 
  img.src = "my_package_resources/img/my_img.gif"; 
  img.width = "280"; 
  img.height = "280"; 
}

这样就绝对没问题了——这个路径是Shiny专门为你的包资源开的“通道”，不管应用怎么部署，都能精准找到那张gif图。

为啥之前的路径都失效？ #

• 本地开发时，你的JS和图片都在同一个www目录下，img/record.gif这种相对路径能直接找到；但打包安装后，这些资源被放到了包的专属目录，和应用自己的www目录不是一回事了，原来的相对路径自然失效。
• 你试的../my_img.gif是从JS所在的js目录往上找，但Shiny加载包的JS时，基准URL是应用的根目录，不是JS文件的实际磁盘位置，所以这个相对路径根本找不到正确的位置。

验证小技巧 #

改完之后，你可以启动一个用你包的Shiny应用，然后在浏览器地址栏输入http://localhost:XXXX/my_package_resources/img/my_img.gif（把XXXX换成你的Shiny端口），如果能看到图片，说明路径注册对了，JS里用这个路径肯定没问题。

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