如何实现将2FA恢复码提取至TXT/CSV文件？

核心思路 #

先从页面中所有带.recovery-code类的<code>元素里提取恢复码，再根据需求格式化成TXT或CSV格式，最后复用你现有的download函数完成文件导出。

具体代码实现 #

1. 提取恢复码的工具函数

先实现一个函数，专门用来抓取页面上的所有恢复码：

function getRecoveryCodes() {
    // 选中所有带recovery-code类的code标签
    const codeElements = document.querySelectorAll('.recovery-code');
    // 转换成数组并提取文本内容，去除可能的多余空格
    return Array.from(codeElements).map(el => el.textContent.trim());
}

2. 导出为TXT文件

提供两种TXT格式选项，适配不同需求：

• 格式一：每行一个恢复码

function exportAsTxt() {
    const codes = getRecoveryCodes();
    // 每个恢复码单独占一行
    const txtContent = codes.join('\n');
    // 调用你已有的下载函数
    download('2fa-recovery-codes.txt', txtContent);
}

• 格式二：和页面显示一致，每行两个恢复码

function exportAsTxtTwoPerLine() {
    const codes = getRecoveryCodes();
    let txtContent = '';
    // 每两个恢复码组成一行
    for (let i = 0; i < codes.length; i += 2) {
        const line = [codes[i], codes[i+1] || ''].join(' ');
        txtContent += line + '\n';
    }
    download('2fa-recovery-codes.txt', txtContent);
}

3. 导出为CSV文件

CSV格式适合用表格工具打开，同样提供两种格式：

• 格式一：每行一个恢复码

function exportAsCsv() {
    const codes = getRecoveryCodes();
    // 可选添加CSV表头，方便识别
    const csvContent = ['Recovery Code'].concat(codes).join('\n');
    download('2fa-recovery-codes.csv', csvContent);
}

• 格式二：每行两个恢复码，用逗号分隔

function exportAsCsvTwoPerLine() {
    const codes = getRecoveryCodes();
    // 添加CSV表头
    let csvContent = 'Code 1,Code 2\n';
    for (let i = 0; i < codes.length; i += 2) {
        const line = [codes[i], codes[i+1] || ''].join(',');
        csvContent += line + '\n';
    }
    download('2fa-recovery-codes.csv', csvContent);
}

4. 页面添加导出按钮

在你渲染恢复码的Razor代码下方，添加触发导出的按钮：

<button onclick="exportAsTxt()">导出为TXT（每行一个）</button>
<button onclick="exportAsTxtTwoPerLine()">导出为TXT（每行两个）</button>
<button onclick="exportAsCsv()">导出为CSV（每行一个）</button>
<button onclick="exportAsCsvTwoPerLine()">导出为CSV（每行两个）</button>

补充说明 #

• 你原有的download函数完全可以直接复用，无需修改，它负责创建下载链接并触发浏览器下载动作。
• 用trim()处理恢复码文本，是为了避免页面渲染时可能出现的多余空格，保证导出的恢复码准确。
• 代码里的codes[i+1] || ''是为了兼容恢复码数量为奇数的情况，避免最后一行因缺少第二个码而报错。

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