Question

我的server.js上有这条路由

app.get('/api/users/download/:id', auth, admin, (req, res) => {
  const file = path.resolve(".") + `/uploads/${req.params.id}`;
    res.download(file)
})

这是我在React中使用CRA的一部分

class AddFile extends Component {
          showFileList = () => (
                this.state.files ?
                    this.state.files.map((item,i)=>(
                        <li key={i}>
                            <Link to={`/api/users/download/${item}`} target="_blank">
                                {item}
                            </Link>
                        </li>
                    ))
                :null
            )
}

    render() {
        return (
          <div>
             {this.showFileList()}
           </div>
          );
    }
export default AddFile;

这些是我的一些路线

const Routes = () => {
  return(
    <Layout>
      <Switch>
        <Route path="/admin/add_file" exact component={Auth(AddFile, true)}/>
        <Route component={Auth(PageNotFound)}/>
      </Switch>
    </Layout>
  )
}

当我单击li项时，它将带我到404找不到的路由，当它应带我到Express中正在处理的路由并下载文件时，BUT显然首先被反应路由器捕获并显示给我我创建的“未找到”页面，可能与package.json上的代理有关吗？

  "proxy": "http://localhost:5000"

谢谢！

Answer 1

一些测试（https://codesandbox.io/s/8ykx3j88v0）表明您可以使用

<Link to="/some-file" download target="_self">..</Link>
常规<a href="/some-file" download>...</a>

使用React Router从Expressr下载文件

1 个答案: