У меня есть работающий экспресс-сервер, как мне заставить это работать с приложением React - PullRequest
0 голосов
/ 13 ноября 2018

Вот мой server.js

const port = process.env.PORT || 5000;
const express = require('express');
const bodyParser = require('body-parser');
const multer = require('multer');
const uuidv4 = require('uuid/v4');
const path = require('path');
const htmlparser = require("htmlparser2");
const fs = require("fs");
let filename = '';
// configure storage
const storage = multer.diskStorage({
  destination: (req, file, cb) => {
    /*
      Files will be saved in the 'uploads' directory. Make
      sure this directory already exists!
    */
    cb(null, './uploads');
  },
  filename: (req, file, cb) => {
    /*
      uuidv4() will generate a random ID that we'll use for the
      new filename. We use path.extname() to get
      the extension from the original file name and add that to the new
      generated ID. These combined will create the file name used
      to save the file on the server and will be available as
      req.file.pathname in the router handler.
    */
    const newFilename = `${uuidv4()}${path.extname(file.originalname)}`;
    cb(null, newFilename);
  },
});
// create the multer instance that will be used to upload/save the file
const upload = multer({ storage });
const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.get("/upload", (req, res) => {
  res.sendFile(__dirname + "/index.html");
});

app.post('/upload', upload.single('selectedFile'), (req, res) => {
  let summary ='';
  let counter =0;
  let times = [];
  let days = [];
  let building = [];
  let date = [];
  let isGood = false;
  filename = req.file.filename;
  fs.readFile('./uploads/'+filename, 'utf8', function(err, data) {
    if (err) throw err;
    //console.log(data);
    const parser = new htmlparser.Parser({
        onopentag: function(name, attribs){
            // summary="This table lists the scheduled meeting times and assigned instructors for this class.."
            if(name === "tr" && attribs === 'summary'){
              //console.log(attribs);
            }

        },
        ontext: function(text){
          if(text==='Class'){
            isGood=true;
            counter++;
          }
          if(text!="Lecture"&&text!="Class"&&isGood){
            if(counter===2){
              times.push(text);
            }
            if(counter===4){
              days.push(text);
            }
            if(counter===6){
              building.push(text);
            }
            if(counter===8){
              date.push(text);
            }
            counter++;
            console.log(text);
            console.log(counter);
            summary = summary+text;
          }
          if(text==="Lecture"){
            isGood=false;
            counter=0;
          }
        },
    }, {decodeEntities: true});
    parser.write(data);
    parser.end();
    console.log("STTTTTTTTTTTTTTTTTTTTTTTAAAAAAAAAAAAAAAAAAAAAAAAAARRRRRRRRRRRRRRRRRRRRRTTTTTTTTTTTTTTT");
    console.log(building);
    console.log(times);
    console.log(date);
    console.log(days);
    fs.unlink('./uploads/'+filename, function(error) {
      if (error) {
          throw error;
      }
      console.log('Deleted filename', filename);
    })
  });
  /*

    We now have a new req.file object here. At this point the file has been saved
    and the req.file.filename value will be the name returned by the
    filename() function defined in the diskStorage configuration. Other form fields
    are available here in req.body.
  */
  res.send();
});

app.listen(port, () => console.log(`Server listening on port ${port}`));

Я могу запустить его, запустив сначала "npm start", а затем этот.Это не проверяет, работает ли что-либо еще на порту 3000, поэтому они оба могут работать на порту 3000. Мне это не нравится, и я не знаю, сработает ли это, как только мы создадим наше приложение React и начнем его размещать,Как я могу объединить этот код с приложением реагировать, чтобы он работал на одном сервере вместо двух?Я попытался буквально объединить start.js и этот код, однако start.js явно предназначен только для целей разработки, а не для конечного продукта.Как я могу подать свой HTML пользователю, и при этом передний конец отправляет его на сервер.

1 Ответ

0 голосов
/ 13 ноября 2018

Достаточно удивительно, что я пришел сюда после того, как исследовал это в течение нескольких часов и сразу после публикации вопроса, если нашел ответ.Ответ прост: добавьте «proxy»: «http://localhost:PORT"

, где PORT = порт экспресс-сервера, на котором он запущен. Я все еще, однако, не знаю, работает ли это с продуктом сборки, хотя он работает с быстрымСтартовый сервер.

Весь кредит идет на этот прекрасный сайт https://dev.to/loujaybee/using-create-react-app-with-express

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...