触发文件上传开始

Question

我想向闪亮的应用程序添加一个 JS 监听器，该监听器在文件上传开始时触发（不是在单击文件上传时，也不是在闪亮的反应值发生变化时触发，这发生在文件上传后，而是我希望在从文件菜单中选择文件并单击“打开”并且上传实际开始时触发它。

背景是，我想告诉用户文件上传（从他们的计算机到我闪亮的应用程序）总共花了多长时间。 为此，我想创建一个 JS 事件监听器，将反应值设置为当前时间，以便稍后在上传完成后获取差异。

注意此示例我使用

alert(1)

来确定代码何时执行，稍后我将使用

Shiny.setInputValue(id, value);

。

MWE

library(shiny)

ui <- fluidPage(
  tags$head(tags$script(r"(
    $(document).on("shiny:inputchanged", function(event) {
      if (event.name === "file") {
        alert("shiny:inputchanged file: trigger too late (same as observeEvent(...))!");
      }
    });
  )")),
  fileInput("file", "Upload File") |> 
    tagAppendAttributes(onclick = "alert('onclick file: trigger too early and duplicated?!');")
)

server <- function(input, output, session) {
  observeEvent(input$file, {
    showNotification("File has been uploaded: Trigger too late")
  })
}

shinyApp(ui, server)

失败的尝试

我尝试向

fileInput

添加一个 onclick 属性，但这会在上传开始之前触发（例如，当用户需要很长时间来选择要上传的文件时，计时将会关闭）。 (

fileInput("file", "File") |> tagAppendAttributes(onclick = "alert(1)")

)

也不起作用，我添加了监听 inputchanged 的 JS 代码，但这会在上传完成后触发。

$(document).on('shiny:inputchanged', function(event) {
  if (event.name === 'file') {
    alert(1);
    console.log('#file has changed');
  }
});

Answer 1

感谢Kevin的回答，我找到了

onInput

触发器，它正是我想要的

library(shiny)

ui <- fluidPage(
  fileInput("file", "Upload File") |> 
    tagAppendAttributes(onInput = "alert('Just Perfect')")
)


server <- function(input, output, session) {
}

shinyApp(ui, server)