繁体   English   中英

如何在快递服务器中使用反应组件

[英]How to use a react component in express server

我试图让一些人将文件上传到我的快速后端,但此页面的表单位于反应组件中。 我如何在我的get函数中使用我的反应组件ConverterSec2

服务器.js:

import ConverterSec2 from "./ihertz_website/src/pages/Converter/ConverterSec2"
const express = require('express')
const app = express();
const port = process.env.PORT || 5000;

//console.log that your server is up and running
app.listen(port, () => console.log('Listening to port 5000'));

//create GET route
app.get('/express_backend', (req, res) => {
    res.sendFile(__dirname + { ConverterSec2 }) //error
});

转换器Sec2:

import React, { Component } from "react"
import "../Converter/Converter.css"

class ConverterSec2 extends Component {

    render() {
        return (
            <div className="sec2">
               <form method="POST" action="/" encType="multipart/form-data">
                 <input type="file" name="file"/>
                 <input type="submit" value="Upload"/>
              </form>
           </div>    
       )
   }
}

export default ConverterSec2

您需要在 package.json 的末尾添加一个代理,如下所示:

{
  "name": "some name",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "serve": "firebase emulators:start --only hosting,firestore"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "proxy": "http://localhost:5000"
}

然后在组件内的请求中,使用一个包,例如 axios 并执行以下操作:

axios.get('/express_backend')

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM