2017-05-18 3 views
0

Ich versuche, eine Ansicht mit JS, Node und Express zu rendern, aber bekomme diesen Fehler 'Unhandled Ablehnung Fehler: Kann Header nicht festlegen, nachdem sie sind geschickt'. Ich weiß, dass es etwas mit asynchronen Rückrufen zu tun hat, aber Ich kann nicht genau herausfinden, wie es zu beheben ist.Nicht behandelte Ablehnung Fehler: Kann Header nicht festlegen, nachdem sie mit Knoten gesendet werden

Das Problem scheint nicht mit dem res.redirect zu sein (das Entfernen zeigt die Daten nicht an), sondern eher mit res.render und var spaces nicht richtig in die EJS laden, denken wir. Wenn wir spaces setzen, erhalten wir die Nachricht "Objektversprechen".

const userController = require('../controllers').user; 
const spaceController = require('../controllers').space; 

module.exports = (app) => { 
    app.get('/', function(req, res) { 
     res.render('index.ejs'); 
    }); 

    app.post('/users/new', function(req,res){ 
    userController.create(req,res); 
    res.redirect('/'); 
    }); 

    app.get('/spaces', function(req, res) { 
    var spaces = spaceController.retrieve(req,res); 
    res.render('spaces/index.ejs', {spaces}); 

    }); 

    app.get('/spaces/new', function(req, res) { 
    res.render('spaces/new.ejs'); 
    }); 

    app.post('/spaces/new', function(req,res){ 
    spaceController.create(req,res); 
    res.redirect('/spaces'); 
    }); 

}; 

Und mein Controller:

const Space = require('../models').Space; 

module.exports = { 
    create(req, res) { 
    return Space 
    .create({ 
     name: req.body.name, 
     description: req.body.description, 
     price: req.body.price, 
    }) 
    .then(space => res.status(201).send(space)) 
    .catch(error => res.status(400).send(error)); 
    }, 

    retrieve(req, res) { 
    return Space 
    .findAll() 
    .then(space => { 
     if (!space) { 
     return res.status(404).send({ 
      message: 'Space Not Found', 
     }); 
     } 
     return res.status(200).send(space); 
    }) 
    .catch(error => res.status(400).send(error)); 
    }, 
}; 

Und meine Ansicht:

<!doctype html> 
<html> 
<head> 
    <title>MakersBnB</title> 
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css"> <!-- load bootstrap css --> 
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css"> <!-- load fontawesome --> 
    <style> 
     body  { padding-top:80px; } 
    </style> 
</head> 
<body> 
<div class="container"> 

<div class="col-sm-6 col-sm-offset-3"> 
    <div class="jumbotron text-center"> 

    <h1>Book a Space</h1> 

<form action="/spaces/new" method="get"> 
    <button type="submit" class="btn btn-warning btn-lg">List a space</button> 

</form> 

<div class="spaces"> 
    <% spaces.each(function(space) { %> 
     <ul> 
      <li><%= space.name %></a></li> 
      <li><%= space.description %></li> 
      <li>£ <%= space.price %></li> 
     </ul> 
     <% });%> 
</div> 


</div> 

</div> 
</body> 
</html> 
+0

Das Problem ist, dass Ihr Controller auf die Anfrage reagiert, und auch der Router. Zum Beispiel app.get ('/ spaces' – yBrodsky

Antwort

0

Sie erhalten diesen Fehler, weil Sie mehrere Antworten für einige Ihrer Anforderungen senden. Sie können nur eine Antwort für eine Anfrage senden.

Zum Beispiel in Ihrer /users/new Route, rufen Sie zuerst userController.create an. userController.create sendet eine Antwort als Teil des Hauptteils der Funktion.

Ihr Code geht dann zurück zum Rückruf für Ihre Route /users/new und ruft die res.redirect('/') auf, die Ihre Route / aufruft, die auch eine Antwort zurückgibt.

Um zu beheben, lassen Sie Ihren Controller die Antwort senden.

Zum Beispiel:

app.post('/users/new', userController.create); 

Im Körper der Controller-Funktionen, können Sie auch wählen, welche Route

app.get('/spaces', spaceController.retrieve); 

und in der Steuerung zu machen:

retrieve(req, res) { 
    return Space 
    .findAll() 
    .then(spaces => { 
     if (!spaces) { 
     return res.status(404).send({ 
      message: 'Space Not Found', 
     }); 
     } 
     return res.status(200).render('spaces/index.ejs', {spaces}); 
    }) 
    .catch(error => res.status(400).send(error)); 
    }, 
0

diese Routen

app.post('/users/new', function(req,res){ 
    userController.create(req,res); 
    res.redirect('/'); 
    }); 

    app.get('/spaces', function(req, res) { 
    var spaces = spaceController.retrieve(req,res); 
    res.render('spaces/index.ejs', {spaces}); 

    }) 
app.post('/spaces/new', function(req,res){ 
    spaceController.create(req,res); 
    res.redirect('/spaces'); 
    }); 

die Logik innerhalb spaceController Griff bereits die Antwort an den Client asynch ronous (beide für Erfolg und Fehler)

, aber Sie senden sofort eine synchrone Antwort (res.redirect), die verhindert, dass Sie die asynchrone Antwort später senden. Dies löst die Ausnahme aus.

Entfernen der res.redirect Anweisung von den drei Routen sollte es beheben.

+0

Habe es leider nicht behoben - das Problem ist, dass 'res.render' und' var spaces' nicht korrekt in das EJS geladen werden, denken wir. Wenn wir 'Leerzeichen setzen ', erhalten wir die Nachricht" object Promise ". –

+1

Die Ausnahme ist ziemlich selbsterklärend, Sie versuchen, eine Antwort an den Client zu senden, wenn Sie bereits eine gesendet haben.Vielleicht haben Sie einige andere Fehler in Ihrem Code, aber die zu beheben Ausnahme Fokus auf, wenn Sie die Antwort zurücksenden – Karim

0
app.post('/users/new', function(req,res){ 
    userController.create(req,res); 
    res.redirect('/'); 
    }); 

Sie beginnen grundsätzlich Space.create() als async und bevor es Sie reagieren mit einer Umleitung beendet.

könnten Sie versuchen,

app.post('/users/new', 
     userController.create, 
     (res,req) => res.redirect('/') 
    ); 

Die Umleitung wird nie damit erreicht werden, aber Sie könnte userController.create nächste zurückkehren() wie dieses

create(req, res, next) { 
    return Space 
    .create({ 
     name: req.body.name, 
     description: req.body.description, 
     price: req.body.price, 
    }) 
    .then((space) => {  
     res.locals.space = space || {}; 
     return next(); 
    }) 
    .catch(error => next(error)); 
    } 

mit dieser Middleware

app.post('/users/new', 
     userController.create, 
     (res,req) => res.status(200).send(res.locals.space) 
    ); 

Beispiele aus dem letzten Projekt: https://github.com/JellyKid/ballsavr/tree/master/Backend/lib

Verwandte Themen