Полный код этого проекта можно найти здесь: https://github.com/AlexMercedCoder/KoaStarterBlog
Здесь можно найти серию видео, которую я делал с этим, чтобы вы могли увидеть, как все работает на разных этапах: https://www.youtube.com/watch?v=8_aWw7lfKKI&list=PLY6oTPmKnKbbF4t0Y9DcUVYi7f4kix7Qj
Я на самом деле иллюстрирую проблему в начальной части этого видео и иду по построению всех моих маршрутов: https://youtu.be/ltAxokJsaWE
Итак, я создал это базовое приложение для блога, используя KoaJS. Когда я первоначально запускаю index.js, поведение выглядит следующим образом. - Root Route Works - Создать маршрут работает - Admin route работает - Кнопка Delete работает на странице администратора - Редактировать маршрут просто нет (работает и выключается, даже если код такой же, как и другие маршруты)
Большая проблема: после отправки формы нажатием кнопки удаления или создания нового сообщения все маршруты, кроме создания маршрута, перестают работать, и вместо этого они просто возвращаются (не найдено). Сначала я подумал, что это проблема, вызванная ctx.redirect, потому что они всегда будут терпеть неудачу и следовать за неработающими маршрутами, но при рендеринге полной страницы, кажется, сначала работает ввод корневого или административного маршрута в браузер после того, как отправка формы все еще прерывается.
* Обновление: это происходит после перехода к любому маршруту, каждый маршрут работает, если к нему поступил первый маршрут, но затем все остальные маршруты, кроме create, работают позже. Как будто первый маршрут создает своего рода неопределенность. Странно то, что маршрутизатор все еще консоль регистрирует все, что должен делать маршрут, до тех пор, пока не будет возвращено либо ctx.render, ctx.redirect, либо ctx.body.
ниже приведен код 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'));