如何在新选项卡上打开.pdf

问题描述 投票:0回答:9

目标:

在某些任务正确完成后,我必须在新选项卡上打印 PDF。

步骤:我想执行一个应该转到服务器的方法,获取 PDF 并在新选项卡上打开它,我正在尝试使用这些但不起作用:

控制器:导出

 public ActionResult PrintPdf()
    {
        Response.AppendHeader("Content-Disposition", "inline; filename= " + MyClassPdfWriter.GetFileName);
        return File(MyClassPdfWriter.GetMemoryStream, "application/pdf");
    }

查看

function TasksSucced(){
      $.get('@Url.Action("PrintPdf", "Export", "new {target = _blank}")');
}
javascript jquery asp.net-mvc-3 url.action
9个回答
35
投票

解决了!这对我有用

 window.open('/Export/PrintPdf');

13
投票

有多种方法可以下载或查看 PDF。

  • 查看

您可以在响应标头中将content-type设置为application/pdf,就像

Content-Type: application/pdf

一样

为了在 JavaScript 中将其打开到新选项卡,请添加此代码。

window.open("Here Download PDF url", '_blank');
  • 下载

您需要在响应头中将content-type设置为application/octet-stream,就像

application/octet-stream
一样。

并将 download HTML5 属性添加到 a 标签或只是 target="_blank"

<a href="PDF URL" download="pdf">Download</a>
<a href="PDF URL" target="_blank">Download</a>

因此您可以使用 PDF.js 或第三个库在 iFrame 或内联页面中查看 PDF。


4
投票
$("a[target!='_blank'][href$='.pdf']").attr("target", "_blank");

4
投票

如果有人遇到类似的问题,上述解决方案在 Google Chrome 中都不适合我(它们在 Firefox 中确实有效)

此代码适用于所有主要浏览器:

var a = document.createElement('A');
var filePath = 'https://pathtopdf.com/file.pdf';
a.href = filePath;
a.download = filePath.substr(filePath.lastIndexOf('/') + 1);
document.body.appendChild(a);
a.click();
document.body.removeChild(a);

0
投票

您可以使用以下解决方案

   jQuery('<form target="_blank" action="' + URL + '" method="get"></form>').appendTo('body').submit().remove();

其中 URL 是 pdf 网址...


0
投票

您可以尝试使用jQuery.defered。我为你准备了示例函数。它将处理 getPdf 调用,然后解析 Promise。希望这有帮助

function getPDF() {
    return '';
}

getPdf()
  .then(function(response) {
    console.log('response here' + response);
    window.open(response);
  }).fail(function(){
      console.error('failed reposne');
  });

0
投票
const openPDF = (link: string) => {
    window.open(link, '_blank');
  };

就用这个简单又容易的方法


0
投票

由于浏览器的政策导致

window.open
无法正常工作,您可以采用下一种方法。

如果你有文件URL,你可以先获取它,然后将

response.body
转换为uint8array,然后创建blob并在浏览器中打开blob。在这种情况下,PDF 将在新选项卡中打开。

const res = await fetch(url)
const uint8arr = new Uint8Array(await new Response(res.body).arrayBuffer())

const link = document.createElement('a')
const blob = new Blob([uint8arr], { type: 'application/pdf' })

link.href = window.URL.createObjectURL(blob)
link.setAttribute('download', 'file.pdf')

document.body.appendChild(link)

link.click()

-1
投票

https://stackoverflow.com/a/72527783

这是我的工作。

我的示例代码

    var order_id = $(this).data('order_id');

    var url = 'pdf url';

    var data      = {
        order_id
    };

    var myHeaders = new Headers();
    myHeaders.append("Content-Type", "application/x-www-form-urlencoded");

    var urlencoded = new URLSearchParams();
    urlencoded.append("param", JSON.stringify(data));

    var requestOptions = {
        method  : 'POST',
        headers : myHeaders,
        body    : urlencoded,
        redirect: 'follow'
    };

    fetch(url, requestOptions)
    .then((response) => response.blob())
    .then((blob) => {
        const _url = window.URL.createObjectURL(blob);
        window.open(_url, '_blank');
    }).catch((err) => {
        console.log(err);
    });
© www.soinside.com 2019 - 2024. All rights reserved.