javascript - 将文件从React.JS前端移动到C++后端

Question

所以我有一个用C++编写的函数，可以在文件上使用。我可以将其转换为脚本，然后脚本以文件位置的参数为例进行处理，这不是问题。

我的前端是用React完成的，它仍然没有连接到后端。我有一个按钮，它是用户单击的“上传文件”，并且需要在我的后端具有此文件才能在其上运行C++代码。

从理论上讲，我的想法(不确定是否可行):

用户选择要上传的文件

从前端，我们将其上传到云存储(例如Google Drive)，例如

然后，我从前端使用REST API发送HTTP请求，并将参数作为文件直接下载链接。

然后，REST API运行一个Python函数，该函数执行以下shell命令:

wget (link that we got from the HTTP request through REST API

之后，python脚本在文件上运行C++函数，并通过HTTP请求返回输出。

那有意义吗？
有没有更简单或更好的方法？

谢谢

Answer 1

问题

让用户加载文件->在该文件上运行C++函数->将输出返回给用户。

REST-API可能的解决方案

正如您在问题中所述，您可以将其上传到Google驱动器，然后再获取该文件，但是它有点太复杂了。相反，您可以做的是跳过上载到Google驱动器的过程，然后直接通过formdata发送文件。

这是React中一个来自here的工作示例:

import React from 'react'
import axios, { post } from 'axios';

class SimpleReactFileUpload extends React.Component {

  constructor(props) {
    super(props);
    this.state ={
      file:null
    }
    this.onFormSubmit = this.onFormSubmit.bind(this)
    this.onChange = this.onChange.bind(this)
    this.fileUpload = this.fileUpload.bind(this)
  }
  onFormSubmit(e){
    e.preventDefault() // Stop form submit
    this.fileUpload(this.state.file).then((response)=>{
      console.log(response.data);
    })
  }
  onChange(e) {
    this.setState({file:e.target.files[0]})
  }
  fileUpload(file){
    const url = 'http://example.com/file-upload';
    const formData = new FormData();
    formData.append('file',file)
    const config = {
        headers: {
            'content-type': 'multipart/form-data'
        }
    }
    return  post(url, formData,config)
  }

  render() {
    return (
      <form onSubmit={this.onFormSubmit}>
        <h1>File Upload</h1>
        <input type="file" onChange={this.onChange} />
        <button type="submit">Upload</button>
      </form>
   )
  }
}

AWS Lambda可能的其他解决方案

对于您的特定用例，我不建议您使用成熟的REST-API，您可以简单地使用事件驱动的lambda函数，例如 AWS Lambda。这样，您只需要上传到Google云端硬盘或S3存储桶，然后Lambda就会运行并生成可以返回给用户的输出。