Javascript 在新选项卡/窗口中打开/下载文件时刷新/导航当前页面

Javascript 在新选项卡/窗口中打开/下载文件时刷新/导航当前页面,javascript,jsf,primefaces,download,new-window,Javascript,Jsf,Primefaces,Download,New Window,我有一个按钮,可以打开一个新的标签页,上面有一个生成的pdf文件。 但是,单击按钮后,我想导航到另一个页面 这意味着,在点击按钮后,我想用pdf打开一个新的选项卡,并在初始选项卡上导航到另一个页面。我正在使用primefacesp:commandButton并尝试使用onclick=“window.location.href='www.google.de'”,但它不起作用。然而,onclick=“window.lalert('www.google.de')”确实有效 这是我的代码: <h:

我有一个按钮,可以打开一个新的标签页,上面有一个生成的pdf文件。 但是,单击按钮后,我想导航到另一个页面

这意味着,在点击按钮后,我想用pdf打开一个新的选项卡,并在初始选项卡上导航到另一个页面。我正在使用primefaces
p:commandButton
并尝试使用
onclick=“window.location.href='www.google.de'”
,但它不起作用。然而,
onclick=“window.lalert('www.google.de')”
确实有效

这是我的代码:

<h:form id="transForm" target="_blank">
<p:commandButton  value="Zertifikat erstellen" ajax="false" 
                                label="Speichert die Anmeldung und erstellt ein Zertifikat im PDF-Format"
                                action="#{transportErfassen.generatePDFZertifikat()}"/>

</h:form>

您基本上是在尝试将2个响应发送回1个请求。这在HTTP中永远不会起作用。如果你想发回2个响应,你必须让客户端以某种方式发出2个请求。您已经找到了解决方案的正确方向,在JavaScript的帮助下,可以在单个事件(单击)上触发多个请求。但是,您在
onclick
中的尝试无效,
窗口的更改。在表单提交之前,单击提交按钮的位置
,将完全中止按钮的原始操作,即提交表单

最好是直接导航到结果页面,该页面在页面加载时调用JavaScript
window.open()
,指向要打开的PDF文件的URL。也就是说,无法将一些HTML/JS代码与指示导航的PDF文件一起发送(因为这显然会损坏PDF文件)。这也意味着,您不能将PDF直接返回表单提交请求。必须重新设计代码,以便后续GET请求可以检索PDF。最好的方法是使用一个简单的servlet。您可以将生成的PDF临时存储在磁盘或会话中,与唯一键关联,并将该唯一键作为请求路径信息或参数传递给
window.open()中的servlet

以下是一个启动示例:

初始格式:


...
豆子:

公共字符串提交(){
File File=File.createTempFile(“zertifikat”、“.pdf”、“/path/to/pdfs”);
this.filename=file.getName();
//给它写内容。
返回“targetview”;
}
目标视图:


open(“#{request.contextPath}/pdfservlet/#{bean.filename}”);
PDF servlet(为简洁起见省略了空检查等;Java 7假定用于
文件#copy()
):


正如BalusC所说,
刷新/浏览当前页面
打开下载文件
是两个不同的响应,必须有两个重新请求。我遇到了类似的问题。我用jsf ajax成功地解决了这个问题

以下是我的部分代码:

XHTML:

<h:commandButton id="download-button" class="download-button"
    value="download">
<f:ajax event="click" execute="@form" render=":msg-area"
    listener="#{myController.checkForDownload}" onevent="checkCallBack" />
</h:commandButton>
<h:commandButton id="download-button2" class="download-button2"
    value="download" style="display: none;"
    action="#{myController.download}">
</h:commandButton>

download按钮
在页面上呈现消息区域,并且
download-button2
触发下载方法。这是两种不同的要求。第一个请求完成后,将触发第二个请求。

感谢您的回复,我非常感谢。
@WebServlet("/pdfservlet/*")
public class PdfServlet extends HttpServlet {

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        File file = new File("/path/to/pdfs", request.getPathInfo().substring(1));
        response.setHeader("Content-Type", "application/pdf");
        response.setHeader("Content-Length", String.valueOf(file.length()));
        response.setHeader("Content-Disposition", "inline; filename=\"zertifikat.pdf\"");
        Files.copy(file.toPath(), response.getOutputStream());
    }

}
<h:commandButton id="download-button" class="download-button"
    value="download">
<f:ajax event="click" execute="@form" render=":msg-area"
    listener="#{myController.checkForDownload}" onevent="checkCallBack" />
</h:commandButton>
<h:commandButton id="download-button2" class="download-button2"
    value="download" style="display: none;"
    action="#{myController.download}">
</h:commandButton>
function checkCallBack(data) {
    var ajaxStatus = data.status;
    switch (ajaxStatus) {
    case "begin":
        break;
    case "complete":
        break;
    case "success":
        document.getElementById('download-form:download-button2').click();
        break;
    }
}