C#文件网页预览

        预览 excel、word、txt、图片、pdf、html、音视频等文件（涉及到格式转换，用到ffmpeg、pdf2swf、wkhtmltopdf工具，iTextSharp类，Aspose(破解版)类、Microsoft.Office.Interop.Excel、Word类、swf文件预览插件FlexPaper）

1、音视频文件用ffmpeg工具转成MP3、MP4文件用html5标签预览

ffmpeg工具下载地址：

https://download.csdn.net/download/lixiaoer757/10413416

ffmpeg工具详解：

https://blog.csdn.net/lixiaoer757/article/details/80311305

2、pdf文件用pdf2swf工具转换成swf文件，用FlexPaper插件预览

pdf2swf工具下载地址：

https://download.csdn.net/download/lixiaoer757/10420499

SwfTools  pdf2swf 参数详解：

https://blog.csdn.net/lixiaoer757/article/details/80338037

FlexPaper工具下载地址：

https://download.csdn.net/download/lixiaoer757/10437315

FlexPaper 使用参数详解：

https://blog.csdn.net/lixiaoer757/article/details/80450758

3、图片、txt文件用iTextSharp类转换成pdf文件，在转换成swf文件预览

iTextSharp类下载：

https://download.csdn.net/download/lixiaoer757/10437345

4、excel、word文件用Aspose类或者Microsoft.Office.Interop.Excel、Word类转换成pdf文件，在转换成 swf文件预览

Aspose类Microsoft.Office.Interop.Excel、Word类下载：

https://download.csdn.net/download/lixiaoer757/10437387

5、html文件用wkhtmltopdf工具转换成pdf，再转换成swf文件预览

wkhtmltopdf工具下载：

https://download.csdn.net/download/lixiaoer757/10437411

前端代码（页面接收预览URL）：

使用vue.js
如果是Word转成html、Excel转成html、txt、html、htm 类型文件直接指向后端返回路径
<iframe class="frameMain" :src="urlIframe" frameborder="0"
                                v-bind:style="{ 'height': mainHeight - 140 + 'px','width':'100%'}"></iframe>

js代码：

resp.Data.RelativePaths//服务器断返回的预览路径（带IP地址和端口号）
resp.Data.DocType//服务器端返回的文件类型
cur.urlIframe = "FilePreview";
let path = !!resp.Data.RelativePaths ? "http://" + resp.Data.RelativePaths : "";
//1 video, 2-2 img-swf,2-1 img, 3 audio, 4-1 doc-html,4-2 doc-swf, 5-1 xls-html,5-2 xls-swf, 6-1 txt,6-2 txt-swf, 7-1 html/htm,7-2 html/htm-swf, 8 pdf
switch (resp.Data.DocType) {
    case "1":
        cur.urlIframe = "FilePreview?fileType=" + resp.Data.DocType + "&filePath=" + path;
        break;
    case "2-1":
        cur.urlIframe = "FilePreview?fileType=" + resp.Data.DocType + "&filePath=" + path;
        break;
    case "3":
        cur.urlIframe = "FilePreview?fileType=" + resp.Data.DocType + "&filePath=" + path;
        break;
    case "4-2":
    case "5-2":
    case "2-2":
    case "6-2":
    case "7-2":
    case "8":
        cur.urlIframe = "PdfPreview?fileType=" + resp.Data.DocType + "&filePath=" + path;
        break;
    case "4-1":
    case "5-1":
    case "2-1":
    case "6-1":
    case "7-1":
        cur.urlIframe = path;
        break;
}

controller代码
//预览文件（图片、音视频文件）
public ActionResult FilePreview(string fileType, string filePath)
{
    ViewBag.fileType = fileType;
    ViewBag.filePath = filePath;
    return View();
}
//预览Pdf、Word、Excel(都转换成swf预览)
public ActionResult PdfPreview(string fileType, string filePath)
{
    ViewBag.fileType = fileType;
    ViewBag.filePath = filePath;
    return View();
}

FilePreview 预览文件（图片、音视频文件）代码，后端用到ffmpeg工具
@{
    ViewBag.Title = "文件预览";
    Layout = "~/Views/Shared/_Layout.cshtml";
    var fileType = ViewBag.fileType;
    var filePath = ViewBag.filePath;
}


<div id="app">
    <el-container id="filePreview">
        @*（因为可能不支持vue动态绑定，所以改成js动态加载）*@


        @*<audio v-bind:style="{ 'display':preview.audioShow}" controls>
                <source :src="preview.audioUrl" type="audio/mpeg">
                <source :src="preview.audioUrl" type="audio/ogg">
                <embed height="50" width="100" :src="preview.audioUrl">
            </audio>*@@*//音频*@


        @*<video  v-bind:style="{ 'height': mainHeight - 17 + 'px','width':'100%','display':preview.videoShow}" controls autoplay>
                <source :src="preview.videoUrl" type="video/ogg">
                <source :src="preview.videoUrl" type="video/mp4">
                <source :src="preview.videoUrl" type="video/webm">
                <object :data="preview.videoUrl"  v-bind:style="{ 'height': mainHeight - 17 + 'px','width':'100%'}">
                    <embed  v-bind:style="{ 'height': mainHeight - 17 + 'px','width':'100%'}" :src="preview.videoUrl">
                </object>
            </video>*@@*//视频*@


        @*<img :src="preview.imgUrl" :style="{ 'display':preview.imgShow}" />*@@*//图片*@
    </el-container>
</div>


<script>
    var app = new Vue({
        el: "#app",
        data: {
            mainHeight: window.innerHeight,
            preview: {
                fileUrl: "",
                audioUrl: "",
                videoUrl: "",
                imgUrl: "",
                fileShow: "none",
                audioShow: "none",
                videoShow: "",
                imgShow: "none"
            },
        },
        mounted: function () {
            const cur = this;
            window.onload = () => {
                cur.pageLoad();
            };
            window.onresize = () => {
                cur.mainHeight = window.innerHeight;
            }
        },
        methods: {
            pageLoad() {
                const cur = this;
                let fileType = "@fileType";//文件类型
                let filePath = "@filePath";//预览URL
                cur.preview = {
                    audioUrl: "",
                    videoUrl: "",
                    imgUrl: "",
                    audioShow: "none",
                    videoShow: "none",
                    imgShow: "none"
                };
                var filePreview = document.getElementById("filePreview");
                var str = "";
                switch (fileType) {


                    case "1"://视频
                        //cur.preview = {
                        //    audioUrl: "",
                        //    videoUrl: filePath,
                        //    imgUrl: "",
                        //    audioShow: "none",
                        //    videoShow: "",
                        //    imgShow: "none"
                        //};
                        str = "<video style='width:100%; height:" + (cur.mainHeight - 17) + "px;' controls autoplay>";
                        str += "< source src = '" + filePath + "' type = 'video/ogg' >";
                        str += "<source src='" + filePath + "' type='video/mp4'>";
                        str += "<source src='" + filePath + "' type='video/webm'>";
                        str += "<object data='" + filePath + "' style='width:100%; height:" + (cur.mainHeight - 17) + "px;'>";
                        str += "<embed style='width:100%; height:" + (cur.mainHeight - 17) + "px;' src='" + filePath + "'>";
                        str += "</object></video>";
                        break;
                    case "2"://图片
                        //cur.preview = {
                        //    audioUrl: "",
                        //    videoUrl: "",
                        //    imgUrl: filePath,
                        //    audioShow: "none",
                        //    videoShow: "none",
                        //    imgShow: ""
                        //};
                        str = "<img src=\"" + filePath + "\"  />";
                        break;
                    case "3"://音频
                        //cur.preview = {
                        //    audioUrl: filePath,
                        //    videoUrl: "",
                        //    imgUrl: "",
                        //    audioShow: "",
                        //    videoShow: "none",
                        //    imgShow: "none"