프론트, 백앤드 연동

 const express = require('express');
 const router = express.Router();
-const bodyParser = require('body-parser');
 
-
-router.get('/data', function(req,res) {
+router.post('/videoResult', function(req,res) {
+    file = req.body[0].preview.split(',')[1];
+    console.log(file.length);
+    
     return res.json({data:'myData'});
 });
 
-
-
 module.exports = router;
\ No newline at end of file

@@ -3,9 +3,14 @@ const express = require('express');
 const app = express();
 const api = require('./apiRouter');
 const cors = require('cors');
+const bodyParser = require('body-parser');
+
 
 app.use(cors());
+app.use(bodyParser.json({limit: '100mb'})); 
+app.use(bodyParser.urlencoded({limit: '100mb', extended: true}));
+app.use(bodyParser());
 app.use('/api', api);
 
-const port = 3001;
+const port = 3002;
 app.listen(port, () => console.log(`노드서버 시작 : ${port}`));

@@ -16,6 +16,7 @@ class Dashboard extends React.Component {
     super(props);
     this.onChangeInputVideo = this.onChangeInputVideo.bind(this);
     this.onClickSaveVideo = this.onClickSaveVideo.bind(this);
+    // this.analysisVideo = this.analysisVideo.bind(this);
     this.state = {
       videoFiles: [],
       videoAnalysisResult:null
@@ -40,16 +41,24 @@ class Dashboard extends React.Component {
     e.preventDefault();
     console.log(this.state.videoFiles);
     console.log("upload video");
+
     // post request
-    fetch('http://localhost:3001/api/data')
+    fetch('http://localhost:3002/api/videoResult',{
+      method: 'POST',
+      mode: 'cors',
+      cache: 'no-cache',
+      credentials: 'same-origin',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      redirect: 'follow',
+      referrer: 'no-referrer',
+      body: JSON.stringify(this.state.videoFiles)
+    })
     .then(res=>res.json())
     .then(data=>this.setState({videoAnalysisResult:data}))
     
     console.log(this.state.videoAnalysisResult);
-    this.setState({
-      videoFiles:[],
-    });
-
   }
 
   static propTypes = {
@@ -58,6 +67,8 @@ class Dashboard extends React.Component {
   };
 
   render() {
+    console.log("render")
+    console.log(this.state.videoFiles)
     return (
       <div>
         <h1 className="page-title">Video Analysis <small><small>Performance</small></small></h1>
@@ -107,4 +118,23 @@ function mapStateToProps(state) {
   }
 }
 
+
 export default connect(mapStateToProps)(Dashboard);
+
+function postData(url = '', data = {}) {
+  // Default options are marked with *
+    return fetch(url, {
+        method: 'POST', // *GET, POST, PUT, DELETE, etc.
+        mode: 'cors', // no-cors, cors, *same-origin
+        cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
+        credentials: 'same-origin', // include, *same-origin, omit
+        headers: {
+            'Content-Type': 'application/json',
+            // 'Content-Type': 'application/x-www-form-urlencoded',
+        },
+        redirect: 'follow', // manual, *follow, error
+        referrer: 'no-referrer', // no-referrer, *client
+        body: JSON.stringify(data), // body data type must match "Content-Type" header
+    })
+    .then(response => response.json()); // parses JSON response into native JavaScript objects 
+}
\ No newline at end of file