本文详细介绍了如何在r shiny应用中实现url重定向，使按钮点击能够在新的浏览器标签页或窗口中打开指定链接。针对`window.location`默认在当前标签页打开的问题，文章提供了一种通过shiny自定义消息处理器与javascript动态创建``标签并设置`target="_blank"`的解决方案，确保链接以预期方式在新标签页打开。
理解Shiny中的自定义消息与JavaScript交互
在Shiny应用中，当我们需要执行一些客户端（浏览器）特有的操作，例如直接操作DOM或触发页面跳转时，通常会借助于R与JavaScript之间的通信机制。session$sendCustomMessage()函数允许R后端向前端发送自定义消息，而前端则通过Shiny.addCustomMessageHandler()来监听并处理这些消息。
最初的尝试通常会使用window.location = message来重定向URL。这种方法确实可以实现页面跳转，但其默认行为是在当前浏览器标签页或窗口中加载新的URL。对于需要新开标签页的需求，这种方法显然无法满足。即使尝试使用window.open，在某些上下文中也可能遇到兼容性或被浏览器拦截的问题，无法稳定实现新标签页的打开。
解决方案：利用动态标签实现新标签页打开
为了确保点击按钮后能在新标签页中打开指定URL，一个更稳健的方法是利用JavaScript动态创建一个隐藏的（锚点）元素，为其设置目标URL和target="_blank"属性，然后模拟点击该元素。target="_blank"属性明确指示浏览器在新标签页或新窗口中打开链接。
以下是实现此功能的完整Shiny应用代码：
library(shiny)
# 定义JavaScript自定义消息处理器
myjs <- "Shiny.addCustomMessageHandler('mymessage', function(message) {
// 创建一个隐藏的a元素
var a = document.createElement('a');
a.style.display = 'none'; // 隐藏元素
a.href = message; // 设置链接地址
a.target = '_blank'; // 关键：在新标签页/窗口中打开
// 将a元素添加到文档body中
document.body.appendChild(a);
// 模拟点击a元素
a.click();
// 移除a元素，保持DOM整洁
a.remove();
});"
ui <- fluidPage(
# 在页面头部引入自定义JavaScript
tags$head(tags$script(myjs)),
actionButton("button", "点击我，在新标签页打开链接")
)
server <- function(input, output, session) {
# 监听按钮点击事件
observeEvent(input$button,{
url <- "https://www.stackoverflow.com/" # 目标URL
# 向前端发送自定义消息，携带目标URL
session$sendCustomMessage("mymessage", url)
})
}
# 运行Shiny应用
shinyApp(ui, server)代码解析
-
myjs变量中的JavaScript代码：
- Shiny.addCustomMessageHandler('mymessage', function(message) { ... });：注册一个名为'mymessage'的自定义消息处理器。当R后端发送此消息时，该函数将被执行，message参数将包含R传递过来的URL。
- var a = document.createElement('a');：在内存中创建一个新的 HTML元素。
- a.style.display = 'none';：将新创建的元素设置为不可见，避免在页面上短暂闪现或影响布局。
- a.href = message;：将从R后端接收到的URL赋值给元素的href属性。
- a.target = '_blank';：这是实现新标签页打开的关键。它告诉浏览器，当这个链接被激活时，应在一个新的空白窗口或标签页中加载目标URL。
- document.body.appendChild(a);：将隐藏的元素添加到文档的中。虽然它被隐藏了，但必须先将其添加到DOM中才能模拟点击。
- a.click();：通过JavaScript程序化地触发元素的点击事件。这会模拟用户点击链接的行为，从而在新标签页中打开URL。
- a.remove();：在链接被激活后，立即将这个临时的元素从DOM中移除，保持页面干净。
-
ui部分：
- tags$head(tags$script(myjs))：将包含自定义JavaScript代码的myjs变量注入到Shiny应用的HTML头部。这确保了在页面加载时，自定义消息处理器就已经注册。
- actionButton("button", "点击我，在新标签页打开链接")：创建一个标准的Shiny按钮。
-
server部分：
- observeEvent(input$button, { ... })：监听名为"button"的按钮的点击事件。
- url
- session$sendCustomMessage("mymessage", url)：当按钮被点击时，R后端通过session$sendCustomMessage()函数向前端发送一个名为"mymessage"的消息，并将url作为数据传递给前端的JavaScript处理器。
注意事项
- 浏览器弹出窗口拦截器：虽然此方法通常能够绕过一些简单的弹出窗口拦截器，但如果用户的浏览器设置得非常严格，或者安全软件介入，仍有极小可能性会被拦截。通常，由于这是用户主动触发的点击事件，被拦截的几率较低。
- 用户体验：频繁地在新标签页打开链接可能会对用户体验造成一定影响，用户可能需要手动关闭大量标签页。在设计应用时，应权衡何时使用新标签页，何时在当前标签页内跳转。
- URL的安全性：确保你重定向的URL是可信的。如果URL是动态生成的，请务必进行适当的验证和清理，以防止潜在的安全漏洞（如开放重定向攻击）。
总结
通过上述方法，我们成功地解决了Shiny应用中按钮点击在新标签页打开URL重定向的问题。这种利用JavaScript动态创建标签并模拟点击的策略，比直接使用window.location或不当使用window.open更加灵活和可靠，为Shiny应用提供了更高级的客户端交互能力。
