如何将XLSX转为JPG或在HTML页面中直接展示XLSX文件

方案一：前端直接解析展示（无需转格式，推荐） #

这种方式不用把XLSX转成图片，直接用JS库读取文件内容并渲染成可查看的表格，完全符合“放入original文件夹即可查看”的要求，步骤如下：

1. 准备解析库：找到XLSX解析库的压缩版文件（比如xlsx.full.min.js），下载后放到项目的scripts文件夹里。
2. 修改HTML代码：替换原来的图片展示逻辑，改成加载并解析XLSX的代码，示例代码如下：

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <title>查看XLSX文件</title>
    <link rel="icon" type="image/png" href="images/logo.png">
    <link rel="stylesheet" href="styles\default.css">
    <!-- 引入本地的XLSX解析库 -->
    <script src="scripts/xlsx.full.min.js"></script>
    <style>
        /* 给表格加基础样式，保证可读性 */
        .xlsx-table {
            border-collapse: collapse;
            margin: 0 auto;
        }
        .xlsx-table th, .xlsx-table td {
            border: 1px solid #ccc;
            padding: 8px;
            text-align: left;
        }
        .xlsx-table th {
            background-color: #f5f5f5;
        }
    </style>
</head>
<body>
    <div class="bg">
        <!-- 用这个容器展示解析后的表格 -->
        <div id="xlsxContainer" class="center"></div>
    </div>

    <script>
        // 读取original文件夹里的XLSX文件，这里替换成你实际的文件名
        fetch('original/你的文件.xlsx')
            .then(res => res.arrayBuffer())
            .then(buffer => {
                // 解析XLSX文件
                const workbook = XLSX.read(buffer, { type: 'array' });
                // 取第一个工作表的内容
                const sheet = workbook.Sheets[workbook.SheetNames[0]];
                // 转成HTML表格
                const tableHtml = XLSX.utils.sheet_to_html(sheet);
                // 插入到容器中
                document.getElementById('xlsxContainer').innerHTML = tableHtml;
                // 给表格加样式类
                document.querySelector('#xlsxContainer table').classList.add('xlsx-table');
            })
            .catch(err => {
                document.getElementById('xlsxContainer').innerHTML = '<p>加载失败，请检查文件是否存在或格式正确</p>';
                console.log(err);
            });
    </script>
</body>
</html>

3. 使用方法：把XLSX文件放到original文件夹，修改代码中fetch里的文件名和你的XLSX文件名一致，打开网页就能看到表格形式的文件内容。

方案二：自动转图片展示（适合仅需预览场景） #

如果一定要用图片展示，手动截图转格式不符合要求，需要后端配合自动转换：

• 用Node.js写个监听脚本，当original文件夹放入XLSX时，自动调用转换工具（比如libreoffice命令行工具、XLSX转图片专用库）生成图片，前端还是用原来的图片标签展示生成的图片。
• 这个方法需要后端开发基础，新手优先考虑方案一。

内容的提问来源于stack exchange，提问作者wxnzks