ノード、エクスプレス、Mongodb、Reactjsで私のAPIリンクからデータを取得することができません

Question

これは私がタスクをフェッチした時のエラーです。これは、クロムコンソールに表示されます。 VM4399：1つのGET https://localhost:3090/tasksネット:: ERR_CONNECTION_CLOSED

そして、私はtasks_reducers.jsで（action.payloadを）にconsole.logを。これは私が戻って

Error: Network Error 
 
    at createError (bundle.js:35834) 
 
    at XMLHttpRequest.handleError (bundle.js:35686)

なった私はすでに、サーバーとクライアントを実行するとエラーになります。 誰でも私を助けてください。前もって感謝します。これは私のサーバーのディレクトリ

です：： はここに私のコードです

サーバー/コントローラは/ TodoController.js

exports.listAll = function(req, res, next) { 
 
    Task.find({}, function(err, task) { 
 
    if(err) { return next(err); } 
 

 
    res.json(task); 
 
    }); 
 
};

サーバー/モデル/

const mongoose = require('mongoose'); 
 
const Schema = mongoose.Schema; 
 

 
const todoSchema = new Schema({ 
 
    title: { 
 
    type: String, 
 
    required: true 
 
    }, 
 
    created_date: { 
 
    type: Date, 
 
    default: Date.now 
 
    }, 
 
    status: { 
 
    type: [{ type: String, enum:['pending', 'ongoing', 'completed'] }], 
 
    default: ['pending'] 
 
    } 
 
}); 
 

 
const ModelClass = mongoose.model('Todos', todoSchema); 
 

 
module.exports = ModelClass;

todos.js

サーバー/ router.js

const TodoController = require('./controller/TodoController'); 
 

 
module.exports = function(app) { 
 
    app.get('/tasks', TodoController.listAll); 
 
    app.post('/tasks', TodoController.createTask); 
 
    app.put('/tasks/:taskId', TodoController.updateTask); 
 
    app.delete('/tasks/:taskId', TodoController.deleteTask); 
 
}

サーバー/ index.js

const express = require('express'); 
 
const mongoose = require('mongoose'); 
 
const bodyParser = require('body-parser'); 
 
const morgan = require('morgan'); 
 
const http = require('http'); 
 
const cors = require('cors'); 
 

 
const app = express(); 
 
const router = require('./router'); 
 

 
// DB setup 
 
mongoose.connect('mongodb://localhost:todos/todos'); 
 

 
// App setup 
 
app.use(morgan('combined')); 
 
app.use(cors({ origin: "http://localhost:8080",credentials: true })); 
 
app.use(bodyParser.json({ type: '*/*' })); 
 
router(app); 
 

 
// Server setup 
 
const port = process.env.port || 3090; 
 
const server = http.createServer(app); 
 
server.listen(port); 
 
console.log('Server listening on:', port);

これらは私のクライアント側です：

クライアント/ SRC /アクション/ index.js

import axios from 'axios'; 
 
import { FETCH_TASKS } from './types'; 
 

 
const ROOT_URL = 'https://localhost:3090/tasks'; 
 

 
export function fetchTasks() { 
 
    const request = axios.get(ROOT_URL); 
 
    return { 
 
    type: FETCH_TASKS, 
 
    payload: request 
 
    }; 
 
}

クライアント/ SRC /アクション/ types.js

export const FETCH_TASKS = 'fetch_tasks';

クライアント/ SRC /reducers/index.js

import { combineReducers } from 'redux'; 
 
import taskReducer from './tasks_reducer'; 
 

 
const rootReducer = combineReducers({ 
 
    tasks: taskReducer 
 
}); 
 

 
export default rootReducer;

クライアント/ SRC /減速/ tasks_reducer.js

import _ from 'lodash'; 
 
import { FETCH_TASKS } from '../actions/types'; 
 

 
export default function(state={}, action) { 
 
    switch(action.type) { 
 
    case FETCH_TASKS: 
 
     console.log(action.payload); 
 
     return state; 
 
    default: 
 
     return state; 
 
    } 
 
}

クライアント/ SRC /減速/アプリ。JSあなたのserver/index.js

で

import _ from 'lodash'; 
 
import React, { Component } from 'react'; 
 
import { connect } from 'react-redux'; 
 
import * as actions from '../actions'; 
 

 
class App extends Component { 
 
    componentWillMount() { 
 
    this.props.fetchTasks(); 
 
    } 
 

 
    render() { 
 
    return (
 
     <div> 
 
     <h1>Todos</h1> 
 
     </div> 
 
    ); 
 
    } 
 
} 
 

 
function mapStateToProps(state) { 
 
    return { tasks: state.tasks }; 
 
} 
 

 
export default connect(mapStateToProps, actions)(App);

Answer 1

あなたは急行のインスタンスを作成し、ルータに

const app = express() 
... 
router(app) 

を渡ししかし、あなたはサーバーを作成するために、別のインスタンスを使用します。

あなたは、サーバーに