node.jsを使ってPOST 404エラーを修正するには？

Question

クイルエディタでアップロードイメージを開発している間、私は投稿要求にこだわっています。 私はこの問題を解決するために何をしなければならないのか分かりません。 投稿要求を使用してデータを送信しようとすると、404エラーが発生します。

ルート/ img.js - UPDATED

var ImageFile = require('../models/imageFiles'); 

var multer = require('multer'); 
var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
     cb(null, 'img/') // Set directory 
    }, 
    filename: function (req, file, cb) { 
     cb(null, file.name) // Set file name 
    } 
}); 

var img = multer({ storage: storage }); 

router.post('/upload', img.single('imgfile'), (req, res, next) => { 
    var imageFile = new ImageFile({ 
     name: req.body.name, 
     type: req.body.type, 
     size: req.body.size, 
     content: req.body.content 
    }); 

    imageFile.save((err, result) => { 
     if (err) { 
      return res.status(500).json({ 
       title: 'An error occured', 
       error: err 
      }); 
     } 
     res.status(201).json({ 
      message: 'User created', 
      obj: result 
     }); 
    }); 
}); 

module.exports = router; 

app.js

const express = require('express'); 
var bodyParser = require('body-parser'); 
const port = process.env.PORT || 3000; 

var path = require('path'); 
var favicon = require('serve-favicon'); 
var logger = require('morgan'); 
var cookieParser = require('cookie-parser'); 

var appRoutes = require('./routes/app'); 
var userRoutes = require('./routes/user'); 
var imgRoutes = require('./routes/img'); 
var app = express(); 

// Start 
app.use(express.static(path.join(__dirname, '../awesome-drill/dist'))); 

app.use(logger('dev')); 
app.use(bodyParser.json({ limit: '10mb' })); 
app.use(bodyParser.urlencoded({ extended: false })); 
app.use(cookieParser()); 
app.use((req, res, next) => { 
    res.setHeader('Access-Control-Allow-Origin', '*'); 
    res.setHeader('Access-Control-Allow-Headers', 'Origin, X-Requested-Width, Content-Type, Accept'); 
    res.setHeader('Access-Control-Allow-Methods', 'POST, GET, PATCH, DELETE, OPTIONS'); 
    next(); 
}); 

app.use('/user', userRoutes); 
app.use('/img', imgRoutes); 
app.use('/', appRoutes); 
app.use(express.static('routes')); 

// It's for routing SPA 
app.get('*', (req, res) => { 
    res.sendFile(path.join(__dirname, '../awesome-drill/dist/index.html')); 
}); 

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

前面サービス（angular4）

import { Injectable } from '@angular/core'; 
import {Http, Headers, Response} from '@angular/http'; 

@Injectable() 
export class FileService { 
    public userId = localStorage.getItem('userId'); 

    constructor(private http: Http) { } 

    imgUpload(obj) { 
    const body = JSON.stringify(obj); 
    const headers = new Headers({ 
     'Content-Type': 'application/json' 
    }); 

    return this.http.post('img/upload', body, { 
     headers: headers 
    }) 
     .map((response: Response) => response.json()); 
    } 
} 

あなたのおかげで、私は私のミスを発見し、私はそれを追加しました。ただし、404エラーが発生します。

これは私のフォルダ構造です。

Answer 1

ルーターをエクスポートしていません。 routes/img.jsファイルの末尾に以下を追加してください。

module.exports = router; 

あなたは今それを持っている方法は、デフォルトのエクスポートはありませんので、あなたは、あなたが何をインポートしていないしているrequire('./routes/img')とき。 console.log(imgRoutes)をapp.jsに入れた場合、おそらくundefinedが返されます。