2017-12-20 3 views
0

Mein Express-Server gibt 404 Fehler zurück, wenn ich versuche, Anfrage von HTML-Formular zu senden. Allerdings funktioniert die Anfrage gut. Ich habe Dateien für Server und Routen getrennt. Ich kann in app.js keine Anfragen stellen, weil es zu viele davon gibt (für verschiedene Seiten). Ich möchte Post-einfügen-Anfrage an db machen, aber ich kann nur keine Informationen aus meinem Formular erhalten.Express.js Router Post Anfrage gibt 404

Gibt es etwas, das ich vermisse?

meine HTML-Formular (ejs genau)

<form action="/add" method="POST"> 
    <input type="text" name="title" placeholder="Event name" /> 
    <input type="text" name="subcategory" placeholder="Category" /> 
    <input type="text" name="date" placeholder="Date" /> 
    <input type="text" name="place" placeholder="Place" /> 
    <input type="text" name="organisator" placeholder="Organisator" /> 
    <textarea name="description" placeholder="Description" onkeyup="adjust_textarea(this)"></textarea> 
    <input type="submit" value="Add" /> 
</form> 

meine App.js Datei (Fehler auf 404 handler)

const express = require('express'); 
const path = require('path'); 
const logger = require('morgan'); 
const cookieParser = require('cookie-parser'); 
const bodyParser = require('body-parser'); 

var app = express(); 

app.set('views', path.join(__dirname, 'views')); 
app.set('view engine', 'ejs'); 

//db connection 
var mysql = require("mysql"); 
app.use(function(req, res, next){ 
    res.locals.connection = mysql.createConnection({ 
     host  : 'localhost', 
     user  : 'root', 
     password : 'mypassword', 
     database : 'mydb' 
    }); 
    res.locals.connection.connect(); 
    next(); 
}); 

app.use(logger('dev')); 
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({ extended: true })); 
app.use(cookieParser()); 
app.use(express.static(path.join(__dirname, 'public'))); 

app.use('/', require('./routes/index')); 
app.use('/events', require('./routes/events')); 

//handling errors 
app.use(function(req, res, next) { 
    var err = new Error('Not Found'); 
    err.status = 404; 
    next(err); 
}); 

app.use(function(err, req, res, next) { 
    res.locals.message = err.message; 
    res.locals.error = req.app.get('env') === 'development' ? err : {}; 
    res.status(err.status || 500); 
    res.render('error'); 
}); 

//server init 
var http = require('http'); 

var server = http.createServer(app); 
server.listen(4000); 
if(server.listening){ 
    console.log('Server is listening on port 4000'); 
} 

module.exports = app; 

meine ./routes/events.js Datei

const express = require('express'); 
const router = express.Router(); 

router.get('/', function (req, res, next) { 
    let query = '*select query*'; 
    res.locals.connection.query(query, function (error, results, fields) { 
     if (error) throw error; 
     res.render('index', { title: 'Events', data: results }); 
    }); 
}); 

router.post('/add', function (req, res) { 
    var obj = req.body.title; 

    console.log(obj); 
    res.redirect('/events'); 
}); 

What i see in browser

Antwort

0

Sie haben den Endpoint 'add' in Ihrer Datei 'routes/events.js' aufgelistet, wodurch die Struktur der endgültigen Route '/ events/add' lautet. In Ihrem Formular senden Sie an den Endpunkt '/ add'. Um das Problem zu beheben, ändern Sie entweder die Aktionsreferenz im Formular in '/ events/add' oder verschieben Sie den Endpunkt '/ add' in seine eigene Route:

router.post('/add', function(req, res) { 
    var obj = req.body.title; 

    console.log(obj); 
    res.redirect('/events'); 
}); 
+0

Vielen Dank! Ich bin ein bisschen verwirrt mit diesen Wegen, weil ich gerade angefangen habe, das zu lernen. Jetzt funktioniert es gut. –