KOA-Views 在第一条路线后突然停止工作

Question

可以找到此项目的完整代码here: https://github.com/AlexMercedCoder/KoaStarterBlog

我用它制作的视频系列可以在这里找到，这样你就可以看到不同阶段的工作原理：https://www.youtube.com/watch?v=8_aWw7lfKKI&list=PLY6oTPmKnKbbF4t0Y9DcUVYi7f4kix7Qj

我实际上在这个视频的开头部分说明了问题并完成了我所有路线的构建：https://youtu.be/ltAxokJsaWE

所以我使用 KoaJS 构建了这个基本的博客应用程序。当我最初运行 index.js 时，行为如下。 - 根路线工程 - 创建路线工程 - 管理路线有效 - 删除按钮适用于管理页面 - 编辑路线不会（即使代码就像其他路线一样，也可以打开和关闭）

更大的问题：通过点击删除按钮或通过创建新的 post 提交表单后，除创建路由之外的所有路由都停止工作，而只是 return（未找到）。起初我认为这是由 ctx.redirect 引起的问题，因为它们总是会失败并且随后是损坏的路由，但是虽然呈现完整的页面似乎可以正常工作，但在提交表单后仍然在浏览器中输入 root 或 admin 路由休息。

*更新：这发生在转到任何路线后，如果它是第一条路线访问，则每条路线都有效，但随后除创建之外的所有其他路线都停止工作。就好像第一条路线创造了某种边缘地带。奇怪的是路由器仍然控制台记录路由应该做的一切，直到 ctx.render、ctx.redirect 或 ctx.body 被 returned.

下面是index.js代码！

///////////////////////
//Initializing Environment Variables and other middleware
//npm i dotenv
//npm i koa-methodoverride
///////////////////////
require('dotenv').config();
const override = require('koa-methodoverride');
const parser = require('koa-bodyparser');


////////////////////////
//Connecting the DB
//npm i mongoose
////////////////////////
const mongoose = require('mongoose');
const db = mongoose.connection;
const host = process.env.host;
const dbupdate = {
    useNewUrlParser: true,
    useUnifiedTopology: true,
    useFindAndModify: false};
mongoose.connect(host, dbupdate);

db.on('error', (err) => console.log('Error, DB Not connected'));
db.on('connected', () => console.log ('connected to mongo'));
db.on('diconnected', () => console.log ('Mongo is disconnected'));
db.on('open', () =>console.log ('Connection Made!'));

////////////////////////////
//Model Schema
///////////////////////////
const Blog = require('./model/blog.js');


///////////////////////
//Create Our Server Object
//npm i koa
///////////////////////
const koa = require('koa');
const server = new koa();

//////////////////////////
//Create Our Static Folder
//npm i koa-static
//////////////////////////
const static = require('koa-static');

//////////////////////////
//Creating Our Router
//npm i koa-router
//////////////////////////
const Router = require('koa-router');
const route = new Router();

/////////////////////////////////
//initializing views
//npm i koa-views
//npm i nunjucks
////////////////////////////////;
const views = require('koa-views');
const nunj = require('nunjucks');
nunj.configure('./views', {autoescape: true});


///////////////////////////
//routes
// route.get - route.post - route.patch - post.put - route.delete
///////////////////////////

//root route
route.get('/', (ctx, next) => {
    console.log('connected to root route');
    return Blog.find({}, (error, results) => {
        console.log(results)
        ctx.render('index.njk', {
            posts: results
        });
    });
});

//admin route
route.get('/admin', (ctx, next) => {
    console.log('connected to admin route');
    return Blog.find({}, (error, results) => {
        console.log(results)
        ctx.render('admin.njk', {
            posts: results
        });
    });
});

//delete route
route.delete('/delete/:id', (ctx, next) => {
    console.log('connected to delete route');
    console.log(ctx.request.body)
    if (ctx.request.body.pw === process.env.pw){
        Blog.findByIdAndRemove(ctx.params.id, (err, result) => {

       })
    }else{
        console.log('wrong password')

    }
    return ctx.render('complete.njk');
});

//edit route
route.get('/edit/:id', (ctx, next) => {
    console.log('connected to edit route');
    return Blog.findById(ctx.params.id, (err, results) => {
        console.log(results);
        ctx.render('edit.njk', {
        post: results
        });
    });
});

route.put('/edit/:id', (ctx, next) => {
    console.log('editing a post');
    console.log(ctx.request.body)
    if (ctx.request.body.pw === process.env.pw){
        Blog.findByIdAndUpdate(ctx.params.id, ctx.request.body, {new:True}, (err, result) => {
         console.log(result); 
        })
     }else{
         console.log('wrong password');
        }
    return ctx.render('complete.njk');
});

//create route
route.get('/create', (ctx, next) => {
    console.log('connected to create route');
    return ctx.render('create.njk');
});

route.post('/create', (ctx, next) => {
    console.log('creating a post');
    console.log(ctx.request.body)
    if (ctx.request.body.pw === process.env.pw){
        Blog.create(ctx.request.body, (err, result) => {
         console.log(result); 
        })
     }else{
         console.log('wrong password');
        ;
     }
     return ctx.render('complete.njk');
});

////////////////////////////
//Async Functions
////////////////////////////
// const getPosts = async (query) => { 
//     const data = await Blog.find({query}) 
//     return data; 
//   }; 

////////////////////////
//Middleware
/////////////////////////
server.use(parser());
server.use(override('_method'))
server.use(views('./views', {map: {njk: 'nunjucks'}}));
server.use(route.routes());
server.use(static('./public'));




/////////////////////
//Our Listener on Port 1985
/////////////////////
server.listen(1985,'localhost',() => console.log('Listening on port 1985'));

Answer 1

看起来像是 http 服务器故障。尝试添加一个 error handler.

我还建议更改代码中的错误处理，例如

route.put('/edit/:id', (ctx, next) => {
    if (ctx.request.body.pw === process.env.pw){
        Blog.findByIdAndUpdate(ctx.params.id, ctx.request.body, {new:True}, (err, result) => {
         console.log(result); 
        })
     } else {
         console.log('wrong password');
        }
    return ctx.render('complete.njk');
});

替换为

route.put('/edit/:id', (ctx, next) => {
  // Early stop to avoid brace ladder
  if (ctx.request.body.pw != process.env.pw)
    ctx.throw('Env. wrong password'); // Pass request to error-handler

  Blog.findByIdAndUpdate(ctx.params.id, ctx.request.body, {new:True}, (err, result) => {
    if (err)              
      ctx.throw('Db wrong password'); // or throw Error('Db wrong password');

    ctx.render('complete.njk');
  });
}
...
server.use(route.routes());
server.use(static('./public'));

// Error handler: catch 'wrong password'-error here.
app.on('error', (err, ctx) => {
  console.error(err);
  ctx.render('error.njk'); 
});

P.S。我使用 Express，而不是 Koa。所以也许我犯了一些错误。

也许 ctx.render 需要 async-await 像下面这样的框架

route.get('/', async (ctx, next) => {
    console.log('connected to root route');
    console.log(ctx);
    return Blog.find({}, (error, results) => {
        console.log(results)
        await ctx.render('index', {
            posts: results
        });
        console.log('the view was rendered')
    });
});

我下载了您的 git 并进行了此更改。它有效:)

Answer 2

我从来没有弄清楚是什么导致了这种行为，但我能够修复并将工作代码提交到 github 存储库。经过几次尝试后，我无法让 koa-views 库正常工作，所以我放弃了它并切换到 koa-nunjucks-2 并完全按照他们的文档中的说明对其进行了初始化。

不幸的是...同样的问题不断发生，直到我使用 path.join 将路径更改为相对路径，然后 koa-nunjucks-2 完美运行！

为什么，或者发生了什么，我仍然不知道。这可能与引擎盖下未解决的承诺有关，但我不太确定。

KOA-Views 在第一条路线后突然停止工作

KOA-Views Suddenly Stop Working after First Route

node.js

mongodb

mongoose

koa

nunjucks