react 中前端下载oss文件

在 React 中，你可以通过 `fetch` 函数下载 OSS 上的文件，然后使用 `FileSaver` 库将文件保存到本地。

以下是一个下载 OSS 文件的示例代码：

import React from 'react';
import fetch from 'node-fetch';
import * as FileSaver from 'file-saver';

class DownloadFile extends React.Component {
  handleDownload = () => {
    const url = '<Your OSS file url>';
    const fileName = '<Your file name>';

    // 下载文件
    fetch(url)
      .then(response => response.blob())
      .then(blob => {
        // 保存文件到本地
        FileSaver.saveAs(blob, fileName);
      });
  }

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

在上面的代码中，你需要将 `<Your OSS file url>` 和 `<Your file name>` 替换为你自己的信息。其中：

- `<Your OSS file url>`：要下载的文件的 URL，例如 `https://<bucket-name>.<region>.aliyuncs.com/<object-name>`。
- `<Your file name>`：要保存到本地的文件名。

注意，由于浏览器的安全限制，你只能下载同源的文件。如果你的 React 应用和 OSS 存储桶不在同一个域名下，你需要在后端实现一个代理来解决跨域问题。