Aspose.Cells实现excel预览


在WEB项目中经常遇到excel文档在线预览的需求,基本的解决思路有以下几大类:excel文档转PDF、excel文档直接转html、后台读取excel数据返回给前端利用Excel效果的表格插件如(HandsonTable)将数据进行展示、部署微软Office Online服务(office web apps)实现在线预览、在线的office预览服务(如谷歌docs、微软officeapps)。

EXCEL转HTML

excel转html可以通过第三方工具openoffice、微软office或者第三方类库如POI/NPOI、aspose.cell等转换为html文件。其中POI组件是开源免费的,Java版本叫POI,C#版本叫NPOI。但是转换的效果不是很好,有多个sheet页面的时候,POI会将所有sheet表格展示在一个网页里面,表格顶部会显示sheet名称,如果sheet很多的话页面会很长,出现滚动条页面样式不是很美观。

aspose.cells是收费组件,支持java、.net、.net core,免费使用时候转换出的html页面会有水印”Evaluation Only. Created with Aspose.Cells”如果excel存在多个sheet,aspose转换出来的网页会带选项卡,点击选项卡会展示对应的sheet页面内容,展示效果比POI转换出的html效果的好。

首先在后台使用aspose读取excel文件并返回转换好的html文件目录返回给前台

private readonly ILogger _logger;
private readonly IWebHostEnvironment _webHostEnvironment;

    public HomeController(ILogger<homecontroller> logger, IWebHostEnvironment webHostEnvironment)
    {
        _logger = logger;
        _webHostEnvironment = webHostEnvironment;
    }
    public IActionResult Index()
    {
        return View();
    }

    public IActionResult Privacy()
    {
        return View();
    }

    [ResponseCache(Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)]
    public IActionResult Error()
    {
        return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier });
    }
    /// <summary>
    /// &#x8FD4;&#x56DE;html&#x5730;&#x5740;
    /// </summary>
    /// <returns></returns>
    public string ExcelToHtml()
    {
        //&#x7A0B;&#x5E8F;&#x6839;&#x76EE;&#x5F55;
        string rootpath = _webHostEnvironment.ContentRootPath;
        //&#x7A0B;&#x5E8F;&#x4E0B;webroot&#x6839;&#x76EE;&#x5F55;
        string webRootPath = _webHostEnvironment.WebRootPath;
        string filepath = webRootPath + "\\excelFile\\test.xlsx";
        //&#x8BFB;&#x53D6;&#x6A21;&#x677F;&#x8DEF;&#x5F84;
        Workbook book = new Workbook(filepath);
        //filePath&#x4E3A;&#x4FDD;&#x5B58;&#x6587;&#x4EF6;&#x7684;&#x5730;&#x5740;&#xFF0C;&#x9700;&#x8981;&#x670D;&#x52A1;&#x7AEF;&#x5E95;&#x4E0B;&#x53EF;&#x4EE5;&#x6B63;&#x5E38;&#x8BBF;&#x95EE;&#x7684;&#x8DEF;&#x5F84;
        book.Save(webRootPath+ "\\excelFile\\test.html", SaveFormat.Html);
        return  "\\excelFile\\test.html";
    }
</homecontroller>

前端接收到后台返回的地址进行一个展示

点击查看代码

@{
    ViewData["Title"] = "Home Page";
}
<script type="text/javascript">
    //预览excel
    function ExcelToHtml() {
        $.ajax({
            url: "/Home/ExcelToHtml",
            data: "",
            type: "get",
            async: false,
            success: function (data) {
                debugger
                console.log(data)
                //获得窗口的垂直位置
                var iWidth = 1400;
                var iHeight = 800;
                var iTop = (window.screen.availHeight - 30 - iHeight) / 2;
                //获得窗口的水平位置
                var iLeft = (window.screen.availWidth - 10 - iWidth) / 2;
                window.open(data, '_blank', 'height=' + iHeight + ',innerHeight=' + iHeight + ',width=' + iWidth + ',innerWidth=' + iWidth + ',top=' + iTop + ',left=' + iLeft + ',status=no,toolbar=no,menubar=no,location=no,resizable=no,scrollbars=0,titlebar=no');
            },error(err)
            {
                debugger
            }
        });
    }
</script>
<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
    <button onclick="ExcelToHtml()">&#x9884;&#x89C8;excel</button>
</div>

效果如下

Aspose.Cells实现excel预览

Original: https://www.cnblogs.com/Sqsdhc/p/16921821.html
Author: Sqsdhc
Title: Aspose.Cells实现excel预览

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/797943/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球