ASP.NET MVC 项目直接预览PDF文件

背景及需求



  项目使用的是MVC4框架,其中有一个功能是根据设置生成PDF文件,并在点击时直接预览。

实现过程



1、第一版实现代码:

  HTML内容

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <div>
        @Html.ActionLink("预览PDF","GetPdf",null,new { target="_blank"})
    </div>
</body>
</html>

  控制器代码

        public ActionResult GetPdf()
        {
            return new FilePathResult("~/content/The Garbage Collection Handbook.pdf", "application/pdf");
        }

  缺点:标题和文件下载时名称不是很友好。

1、第二版实现代码:

  我们做了2件事情:

    1、让下载弹出框能显示友好的下载文件名。

    2、让浏览器中的其他两个显示GetPdf的地方也显示友好的内容。

  自定义ActionFilter,对Header进行修改,变为内联。(直接这么替换不知道会不会有隐患。)

 public class MyPdfActionFilter : ActionFilterAttribute
    {
        public override void OnResultExecuted(ResultExecutedContext filterContext)
        {
            //Content-Disposition=attachment%3b+filename%3d%22The+Garbage+Collection+Handbook.pdf%22}
            var filerHeader = filterContext.HttpContext.Response.Headers.Get("Content-Disposition");
            if (!string.IsNullOrEmpty(filerHeader) && filerHeader.Substring(0, "attachment".Length).ToLower().Equals("attachment"))
            {
                filterContext.HttpContext.Response.Headers["Content-Disposition"] = "inline" + filerHeader.Substring("attachment".Length, filerHeader.Length - "attachment".Length);
            }
        }
    }

  自定义ActionNameSelector实现对Action名称的拦截和判断。

    public class MyActionNameSelecter : ActionNameSelectorAttribute
    {
        public override bool IsValidName(ControllerContext controllerContext, string actionName, MethodInfo methodInfo)
        {
            return actionName.Contains("-PDF文件预览");
        }
    }

  控制器内代码修改如下

        [MyActionNameSelecter]
        [MyPdfActionFilter]
        public ActionResult GetPdf()
        {
            return new FilePathResult("~/content/The Garbage Collection Handbook.pdf", "application/pdf")
            //增加FileDownloadName设置,但是这会让内容以附件的形式响应到浏览器(具体参考文件响应模式:内联和附件)。
            //文件变成被浏览器下载。
            { FileDownloadName = "The Garbage Collection Handbook.pdf" };
        }

  页面内容修改如下

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <div>
        @* 第二个参数可能是一个动态生成的内容,需要ACTION中增加名称选择拦截,所以自定义了一个ActionNameSelectorAttribute类满足要求。 *@
        @Html.ActionLink("预览PDF", "The Garbage Collection Handbook-PDF文件预览", null,new { target="_blank"})
    </div>
</body>
</html>

最终效果



时间: 2024-11-24 11:10:23

ASP.NET MVC 项目直接预览PDF文件的相关文章

linux在线预览pdf文件开发思路

准备:swftools,flexpaper 基本思路: 1,将pdf文件转化成swf文件 2,使用flexpaper预览swf文件 主要代码: 1,在linux中安装swftools.官网下载swftools 安装包,解压 2,./configure --prefix=安装路径 make install 执行完之后,执行pdf2swf -help 如果显示.说明安装成功 如果执行pdf2swf -help  显示commond not find 的话,可能需要配置swftools的环境变量,具体

js预览PDF文件,使用iframe实现

有时候需要预览PDF文件,需要实现可放大.缩小.下载.打印等功能,我使用了iframe框架. 实现效果: 实现代码: 我直接写在了一个公共组件中,在需要预览的页面直接引用该子组件即可. <iframe :src="src" frameborder="0" style="width: 100%; height: 100%"></iframe> data() { return { src: 'http://storage.xu

fis3+vue+pdf.js制作预览PDF文件或其他

人生第一篇博客,的确有点紧张,但有些许兴奋,因为这对于我来说应该是一个好的开始,以此励志在技术的道路上越走越远. 看过了多多少少的技术博客,给自己带来了很多技术上的收获,也因此在想什么时候自己也可以赠人玫瑰,手留余香呢?终于时候到了...哈哈 首先容我吐槽一番,在大前端的背景下各种框架层出不穷,相对的各种打包工具也应用而生,要说最火的就是webpack了,用户多所以社区相对活跃,团队维护,网上也有各种各样的问题可以轻易搜到从而解决自己的遇到的各种奇葩问题,所以90%的项目都会采用webpack来

vue、Element 点击按钮以弹窗形式预览pdf文件

直接上代码吧 <div > <el-button type="success" size="small" @click="isViewPdf20 = true" >按钮</el-button></div> <el-dialog title="预览文件" :visible.sync="isViewPdf20" :before-close="han

jquery在线预览PDF文件,打开PDF文件(向下兼容ie8、ie7)

最主要的是使用到了一个jquery的插件jquery.media.js,使用这个插件就很容易实现了. 核心代码 Html代码   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/199

elementUI el-dialog 解决embed标签无法实时更新预览PDF文件

<el-dialog class="padd-dialog" width="60%" title="详情" @opened="opened" :visible.sync="previewDialogvisible" append-to-body> <div class="dialog-body"> <!-- <embed style="wid

IOS 预览pdf,word文档的集中方式

在iPhone中可以很方便的预览文档文件,如:pdf.word等等,这篇文章将以PDF为例.介绍三种预览PDF的方式,又分别从本地pdf文档和网络上的pdf文档进行对比. 预览本地PDF文档: 1.使用UIWebView控件 UIWebView是iPhone开发中最常用的控件之一,类似.net中的webBrowser控件.使用它预览PDF文件相当的方便和简单. 在UIWebView中预览PDF文档的关键代码如下: 效果: 2.使用CLPreviewController CLPreviewCont

vue文件流转换成pdf预览(pdf.js+iframe)

参考文档:https://www.jianshu.com/p/242525315bf6 PDFJS: https://mozilla.github.io/pdf.js/     支持获取文件流到客户端,生成blob地址预览 ViewerJS: http://viewerjs.org/   预览pdf文件,其pdf文件只能url地址 Vue-pdf https://github.com/FranckFreiburger/vue-pdf 会出现空白页( 推荐使用iframe方法 ) 无论从功能.兼容

实现在线预览PDF的几种解决方案

原文:实现在线预览PDF的几种解决方案 因客户需要实现PDF的预览处理,在网上找了一些PDF在线预览的解决方案,有的用PDFJS的在线预览方式,有的使用PDFObject的嵌入式显示,有的通过转换JPG/PNG方式实现间接显示的方式,开始是想通过简单的方式,能够使用JS插件实现预览最好,可是在线预览总是有一些不足,如不同浏览器的兼容问题,甚至不同的手机平台中展示的效果也不一样,不过最好还是采用了间接的方式,把PDF转换为图片展示效果,达到客户的要求. 1.在线实现预览的方式 一开始我还是很倾向使