如何在react和express中创建可下载链接

import React from 'react';

const DownloadButton = () => {
  const handleDownload = () => {
    // 创建一个下载链接
    const downloadLink = document.createElement('a');
    downloadLink.href = '/api/download'; // 这里的路径是Express服务器上处理下载请求的路由
    downloadLink.download = 'file.txt'; // 下载的文件名
    downloadLink.click();
  };

  return (
    <button onClick={handleDownload}>下载文件</button>
  );
};

export default DownloadButton;

const express = require('express');
const fs = require('fs');

const app = express();

app.get('/api/download', (req, res) => {
  const filePath = 'path/to/file.txt'; // 下载文件的路径
  const fileName = 'file.txt'; // 下载的文件名

  // 设置响应头，指定文件名和内容类型
  res.setHeader('Content-Disposition', `attachment; filename="${fileName}"`);
  res.setHeader('Content-Type', 'application/octet-stream');

  // 创建可读流并将其管道传输到响应对象
  const fileStream = fs.createReadStream(filePath);
  fileStream.pipe(res);
});

app.listen(3000, () => {
  console.log('Express服务器已启动');
});